.pcOnly {display: inline-block !important;}
.spOnly {display: none !important;}

.col2Wrap{ overflow: hidden;}
.col2Wrap .left{ float: left;}
.col2Wrap .right{ float: right;}

#special{ margin: 0 auto; padding-bottom: 120px; max-width: 1256px; width: 100%; position: relative; background: #fff; text-align: center;}

#special .btn{ margin: 60px auto 0; text-align: center;}
#special .btn a{ transition: 0.4s;}
#special .btn a:hover{ opacity: 0.6;}

#social-wrap { position: absolute; right: 0; top: 15px; overflow: hidden; z-index: 9; }
#social-wrap a.fb { background-position: 0 0; }
#social-wrap a.tw { background-position: -36px 0; }
#social-wrap a { display: block; width: 36px; height: 36px; background: url(../img/social_bt.png) no-repeat left top; margin: 0 10px 0 0; float: left; text-indent: -9999px; }
#special .keyVisual{ padding-top: 120px;}
#special .detail{ background: #fff; margin-top: -20px;}
#special p{ font-size: 1.8rem; line-height: 2;}
#special sup{ font-size: 60%; vertical-align: super;}
#special .sup{ font-size: 60%; margin: 10px 0 0;}

#sec01{ width: 100%; max-width: 1256px;}
#sec02{ width: 1160px; overflow: hidden; margin: 0 auto;}

@media screen and (max-width: 768px){
   .pcOnly {display: none !important;}
   .spOnly {display: inline-block !important;}

   .col2Wrap .left{ float: none;}
   .col2Wrap .right{ float: none;}	

   #special { max-width: 100%; padding-bottom: 60px;}
   #special p{ line-height: 1.8; font-size: 1.6rem;}

   #special .btn{ margin: 40px auto 0; text-align: center; width: 92%;}

   #special .keyVisual{ padding-top: 50px; margin-top: -30px;}
   #special .detail{ padding: 0 0 50px; margin-top: -10px;}
   #special p{ font-size: 1.4rem; line-height: 2;}
   #special sup,#special .sup{ font-size: 60%; margin: 6px 0 0; vertical-align: super;}

   #sec01{ width: 100%; height: auto;}
   #sec02,#Item02{ width: 100%; margin: 60px auto 0;}
   #social-wrap { top: 10px;}
}

#sec02 { margin-top: 60px;}
#sec02 .detail dl{ display: flex; justify-content: center;}
#sec02 .detail dl dt{ width: 225px; margin: 10px 65px 0 0;}
#sec02 .detail dl dd{ width: 660px; text-align: left;}
#sec02 .detail dl dd h2{ font-size: 2.6rem; line-height: 1.7;}
#sec02 .detail dl dd p{ font-size: 1.6rem; margin: 8px 0;}
#sec02 .detail dl dd p.glayWrap{ font-size: 1.6rem; background: #f0f0f0; display: inline-block; border-radius: 4px; padding: 0 20px 0 0;}
#sec02 .detail dl dd p.glayWrap span{ font-size: 1.6rem; color: #fff; display: inline-block; padding: 8px 12px; margin-right: 10px; background: #000; border-radius: 4px;}
#sec02 .detail dl dd p.glayWrap strong{ display: inline-block; font-weight: normal;}
#sec02 .detail dl dd .sup{ font-size: 1.2rem;}

#sec02 .detail .col2WrapA{ margin: 60px 0 0 0; display: flex; flex-wrap: wrap;}
#sec02 .detail .col2WrapA li{ width: 370px; margin: 0 10px; text-align: left;}
#sec02 .detail .col2WrapA li:last-child{ margin: 0;}
#sec02 .detail .col2WrapA li h3{ margin-bottom: 20px;}
#sec02 .detail .col2WrapA li .contCol2{ display: flex; justify-content: flex-start;}
#sec02 .detail .col2WrapA li .contCol2 .innterImg{ margin-right: 20px; width: 130px; display: block;}
#sec02 .detail .col2WrapA li .contCol2 .text{ width: 220px;}
#sec02 .detail .col2WrapA li .contCol2 .text h4{ font-size: 1.6rem;}
#sec02 .detail .col2WrapA li .contCol2 .text ul{ display: block; margin: 10px 0 0 0;}
#sec02 .detail .col2WrapA li .contCol2 .text ul li{ width: auto; display: block; font-size: 1.4rem; margin: 0 0 10px 0;}

@media screen and (max-width: 768px){
   #sec02 .detail dl{ display: flex; justify-content: center; flex-wrap: wrap;}
   #sec02 .detail dl dt{ width: 160px; margin: 10px 0 10px 0; order: 2;}
   #sec02 .detail dl dd.op1{ width: auto; text-align: center; order: 1;}
   #sec02 .detail dl dd.op3{ width: 80%; text-align: center; order: 3;}
   #sec02 .detail dl dd h2{ font-size: 1.9rem; line-height: 1.5; margin-top: 0;}
   #sec02 .detail dl dd p{ font-size: 1.4rem; margin-top: 10px;}
   #sec02 .detail dl dd p.glayWrap{ font-size: 1.2rem; display: flex; align-items: stretch; border-radius: 5px; padding: 0; margin-top: 5px;}
   #sec02 .detail dl dd p.glayWrap span{ font-size: 1.2rem; display: flex; align-items: center; padding: 5px 16px; margin-right: 5px; border-radius: 5px;}
   #sec02 .detail dl dd p.glayWrap strong{ display: flex; align-items: center; font-weight: normal; text-align: left; padding: 5px 0;}
   #sec02 .detail dl dd .sup{ font-size: 1.1rem;}
   
   #sec02 .detail .col2WrapA{ margin: 30px 15px 0 15px; display: flex; flex-wrap: wrap;}
   #sec02 .detail .col2WrapA li{ width: auto; margin: 0;}
   #sec02 .detail .col2WrapA li h3{ margin-bottom: 15px;}
   #sec02 .detail .col2WrapA li h3 img{ width: 328px;}
   #sec02 .detail .col2WrapA li .contCol2{ display: flex; justify-content: flex-start; margin-bottom: 25px;}
   #sec02 .detail .col2WrapA li .contCol2 .innterImg{ margin-right: 20px; width: 130px;}
   #sec02 .detail .col2WrapA li .contCol2 .text{ width: calc(100% - 150px);}
   #sec02 .detail .col2WrapA li .contCol2 .text h4{ font-size: 1.5rem;}
   #sec02 .detail .col2WrapA li .contCol2 .text ul{ display: block; margin: 10px 0 0 0;}
   #sec02 .detail .col2WrapA li .contCol2 .text ul li{ width: auto; display: block; font-size: 1.3rem; margin: 0 0 5px 0;}
}

#sec03 .detail dl{ display: flex; justify-content: center;}
#sec03 .detail h2{ font-size: 2.6rem; line-height: 1.7;}
#sec03 .detail .lead{ font-size: 1.6rem; margin: 8px 0;}

#sec03 .detail .col2WrapB{ margin: 50px 0 0 0; flex-wrap: wrap;}
#sec03 .detail .col2WrapB dl{ width: 370px; margin: 0 40px; text-align: left; display: inline-block; position: relative;}
#sec03 .detail .col2WrapB dt{ margin-top: 180px; z-index: 9; position: inherit;}
#sec03 .detail .col2WrapB dt p{ font-size: 1.6rem;}
#sec03 .detail .col2WrapB dd{ position: absolute; top: 0; right: 0;}

@media screen and (max-width: 768px){
  #sec03 .detail h2{ font-size: 1.9rem;}
  #sec03 .detail .lead{ font-size: 1.4rem;}
  
  #sec03 .detail .col2WrapB{ margin: 20px auto; width: 95%}
  #sec03 .detail .col2WrapB dl{ width: 48%; margin: 0;}
  #sec03 .detail .col2WrapB dt{ margin-top: 180px; z-index: 9;}
  #sec03 .detail .col2WrapB dt p{ font-size: 1.1rem;}
  #sec03 .detail .col2WrapB dt img{ width: 154px;}
  #sec03 .detail .col2WrapB dd img{ width: 130px;}
  #sec03 .detail .col2WrapB dd{ position: absolute; top: 0; right: 20px; left: 0; text-align: center;}
}

#sec04 .detail{ padding: 0;}
#sec04 .detail dl{ display: flex; justify-content: center;}
#sec04 .detail h2{ font-size: 2.6rem; line-height: 1.7;}
#sec04 .detail .lead{ font-size: 1.6rem; margin: 8px 0;}

#sec04 .detail .col2WrapC{ margin: 40px 0 0 0; flex-wrap: wrap;}
#sec04 .detail .col2WrapC dl{ width: 320px; margin: 0; display: inline-block;}
#sec04 .detail .col2WrapC dt img{ width: 160px;}
#sec04 .detail .col2WrapC dd h3{ font-size: 4rem; font-weight: normal; font-family: 'MQ'; line-height: 1; letter-spacing: 1px; display: block; margin: 15px 0 0;}
#sec04 .detail .col2WrapC dd p{ font-size: 1.6rem; margin-top: 10px;}

@media screen and (max-width: 768px){
  #sec04 .detail h2{ font-size: 1.9rem;}
  #sec04 .detail .lead{ font-size: 1.4rem;}
  
  #sec04 .detail .col2WrapC{ margin: 20px 0 50px 0; flex-wrap: wrap;}
  #sec04 .detail .col2WrapC dl{ width: 100%; display: block; padding: 0 25px; margin-bottom: 30px; overflow: hidden;}
  #sec04 .detail .col2WrapC dt{ float: left; margin-right: 20px;}
  #sec04 .detail .col2WrapC dt img{ width: 110px;}
  #sec04 .detail .col2WrapC dd{ float: left; width: calc(100% - 130px); text-align: left;}
  #sec04 .detail .col2WrapC dd h3{ font-size: 3.2rem; font-weight: normal; font-family: 'MQ'; line-height: 1; letter-spacing: 1px; display: block; margin: 0 0 5px;}
  #sec04 .detail .col2WrapC dd p{ font-size: 1.2rem; margin-top: 0; line-height: 1.6;}
}