@charset "UTF-8";
/* CSS Document */
@media screen and (min-width:0px) {
#title{
  background-image:  url("../images/philosophy_h1_bg.jpg");
}

.contents{
  padding: 60px 20px 0;
  text-align: center;
}
  
.contents article{margin: 0 0 60px;}

.contents article h3 img{
  width: auto;
  height: 45px;
}
  
.contents article h4{
  font-size: 2em;
  font-weight: 600;
  text-align: center;
  margin: 40px 0;
  line-height: 1.75;
}

.contents article p{
  font-size: 1.4em;
  line-height: 2.25;
  letter-spacing: 0.02em;
  margin: 0 0 34px;
}

.contents article p.img img{
  width: 200px;
  height: auto;
}
}
@media screen and (min-width:1000px) {
.contents{
  max-width: 1000px;
  margin: 0 auto;
  background-image: url("../images/philosophy_bg_img_01.png"),url("../images/philosophy_bg_img_02.png"),url("../images/philosophy_bg_img_03.png"),url("../images/philosophy_bg_img_04.png");
  background-repeat: no-repeat;
  background-size: 50px auto,190px auto,60px auto,112px auto;
  background-position: 10% 10%,10% 60%,90% 50%,90% 85%;
}
  
.contents article{position: relative;}

.contents article h4{
  font-size: 2.4em;
  letter-spacing: 0.075em;
  }

.contents article p{
  font-size: 1.6em;
  letter-spacing: 0.1em;
}

.contents article p.img img{
  width: 200px;
  height: auto;
}
.contents article p.img{position: absolute;}

.contents article:first-of-type p.img{
  transform: rotate(6deg);
  top: 210px;
  right: 0;
}
.contents article:nth-of-type(2) p.img{
  transform: rotate(-6deg);
  bottom: 0;
  left: 0;
}
}