@charset "UTF-8";
@font-face {
  font-family: "ASansreg";
  src: url("../font/ASansreg.woff") format("woff"), url("../../font/ASansreg.ttf") format("truetype"); }

body {
  margin: 0;
  padding: 0; 
}

p, ul, li {
  margin: 0;
  padding: 0;
  list-style-type: none; 
}

#otonamuse_200528 {
  width: 100%;
  margin: 0 auto calc(200* (100vw / 750));
  font-size: calc(26* (100vw / 750));
  font-family: "ASansreg", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
  color: #000; 
}
#otonamuse_200528 img {width: 100%; }
#otonamuse_200528 a {display: block;}
#otonamuse_200528 .pc_only {
  display: none; 
}
/*クレジット*/
#otonamuse_200528 .credit {
  font-size: 0;
  text-align: left;
  margin-top: calc(30* (100vw / 750)); 
  padding: 0 calc(18* (100vw / 750)); 
}
#otonamuse_200528 .sec05 .credit,
#otonamuse_200528 .credit.right{text-align: right;}
#otonamuse_200528 .credit li {
  display: inline-block;
  font-family: "ASansreg";
  font-size: calc(26* (100vw / 750));
  letter-spacing: .025em;
  margin-right: calc(24* (100vw / 750));
  line-height: calc(48* (100vw / 750));
  color: #000;
}
#otonamuse_200528 .credit li.mr0{margin-right: 0;}
#otonamuse_200528 .sec05 .credit li,
#otonamuse_200528 .credit.right li{margin-left: calc(24* (100vw / 750));margin-right: 0;}
#otonamuse_200528 .credit li a {text-decoration: underline; }

/*sec*/
#otonamuse_200528 section{position: relative;}
#otonamuse_200528 .mv p{
  text-align: center;
  font-size: calc(28* (100vw / 750));
  line-height: 2;
  margin: calc(90* (100vw / 750)) auto calc(180* (100vw / 750));
}
#otonamuse_200528 .sec {
  margin: 0 auto calc(160* (100vw / 750)); 
}
#otonamuse_200528 .text_blk{
  position: relative;
  padding: calc(40* (100vw / 750)) calc(50* (100vw / 750));
  font-size: calc(30 * (100vw / 750));
  line-height: calc(52* (100vw / 750));
  margin-bottom: calc(60 * (100vw / 750));
  display: inline-table;
  z-index: 1;
  top: 0;
  left: 0;
}
#otonamuse_200528 .sec01 .text_blk,
#otonamuse_200528 .sec05 .text_blk{position: absolute;}
#otonamuse_200528 .text_blk::before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  background: url(../img/left.svg) no-repeat right center;
  width: calc(140* (100vw / 750));
  height: calc(52* (100vw / 750));
}
#otonamuse_200528 .text_blk::after{
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  background: url(../img/right.svg) no-repeat right center;
  width: calc(140* (100vw / 750));
  height: calc(52* (100vw / 750));
}

#otonamuse_200528 .sec01 {
  padding: calc(120* (100vw / 750)) 0 0 calc(46* (100vw / 750));
  box-sizing: border-box;
  margin-left: calc(28 * (100vw / 750))
}
#otonamuse_200528 .sec01 .img01{
  width: calc(676 * (100vw / 750));
}
#otonamuse_200528 .sec02 .text_blk{
  margin-left: calc(210 * (100vw / 750));
}
#otonamuse_200528 .sec03 .text_blk{
  margin-left: calc(38 * (100vw / 750));
}
#otonamuse_200528 .sec03 .img03{
  width: calc(676 * (100vw / 750));
  margin: auto;
}
#otonamuse_200528 .sec04{
  width: calc(410 * (100vw / 750));
  margin: 0 auto calc(80 * (100vw / 750));;
}
#otonamuse_200528 .sec04 div{
  background: url(../img/bg_sp.jpg) no-repeat right center/100%;
  color: #fff;
  font-size: calc(30 * (100vw / 750));
  width: calc(400 * (100vw / 750));
  height: calc(56 * (100vw / 750));
  line-height: calc(56 * (100vw / 750));
  text-align: center;
  margin: calc(40 * (100vw / 750)) auto 0;
}
#otonamuse_200528 .sec05{
  margin: 0 0 calc(120 * (100vw / 750)) calc(40 * (100vw / 750));
  width: calc(710 * (100vw / 750));
  padding-top: calc(120 * (100vw / 750));
  box-sizing: border-box;
}
#otonamuse_200528 .sec05 .img04{
  width: calc(710 * (100vw / 750));
}
#otonamuse_200528 .sec06{
  height: calc(740 * (100vw / 750));
  padding: calc(52 * (100vw / 750)) 0 calc(100 * (100vw / 750)) 0;
  box-sizing: border-box;
  background-color: #f7f4f0;
  text-align: center;
}
#otonamuse_200528 .sec06 h2{
  font-family: pragmatica, sans-serif;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  font-size: calc(36 * (100vw / 750));
  padding:0 calc(6 * (100vw / 750)) calc(20 * (100vw / 750));
  border-bottom: 1px solid;
  display: inline-block;
  margin: 0 auto calc(58 * (100vw / 750));
}
#otonamuse_200528 .sec06 .flex{
  position: relative;
  height: 100%;
}
#otonamuse_200528 .sec06 .img{
  position: absolute;
  z-index: 1;
  width: calc(340 * (100vw / 750));
  margin: auto;
  top: 1vh;
  bottom: 0;
  right: 0;
}
#otonamuse_200528 .sec06 .check_blk{
  position: absolute;
  left: calc(40 * (100vw / 750));
  z-index: 2;
}
#otonamuse_200528 .sec06 .check_blk ul li{
  text-align: left;
  font-size: calc(26 * (100vw / 750));
  line-height: calc(36 * (100vw / 750));
  text-indent: calc(-50 * (100vw / 750));
  padding-left: calc(50 * (100vw / 750));
}
#otonamuse_200528 .sec06 .check_blk ul li:not(:last-child){margin-bottom: calc(30 * (100vw / 750));}
#otonamuse_200528 .sec06 .check_blk ul li img{
  width: calc(30 * (100vw / 750));
  margin-right: calc(20 * (100vw / 750));;
}


/*btn_blk*/
#otonamuse_200528 .btn_blk {
  width: 90.13%;
  height: calc(120* (100vw / 750));
  margin: calc(140* (100vw / 750)) auto 0;
  border: 1px solid #000000; 
}
#otonamuse_200528 .btn_blk a {
  width: 100%;
  height: 100%;
  line-height: calc(120* (100vw / 750));
  text-align: center;
  font-size: calc(28* (100vw / 750));
  color: #000;
  letter-spacing: 0.06em;
  text-decoration: none; 
}
