.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: 60px;}
#special sup{ font-size: 60%; vertical-align: super;}
#special .sup{ font-size: 60%; margin: 10px 0 0;}

#sec01{ width: 100%; max-width: 1256px;}
.detail{ width: 1140px; 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 .btn{ margin: 0 auto; text-align: center; width: 92%;}

   #special .keyVisual{ padding-top: 50px; margin-top: -30px;}
   #special sup,#special .sup{ font-size: 60%; margin: 6px 0 0; vertical-align: super;}

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

.detail{ margin-top: 120px;}
.detail .col2Wrap{ display: flex; justify-content: center; margin-bottom: 70px;}
.detail .col2Wrap .left{ width: 440px;}
.detail .col2Wrap .left .w184{ width: 184px; margin-bottom: 10px;}
.detail .col2Wrap .right{ width: 660px; text-align: left; margin-left: 40px;}
.detail .col2Wrap .right h2{ font-size: 7rem; font-weight: normal; font-family: 'MQ'; line-height: 1; margin-bottom: 5px;}
.detail .col2Wrap .right .name{ font-size: 1.8rem; font-weight: bold; margin: 0 0 5px;}
.detail .col2Wrap .right h3{ font-size: 1.6rem; font-weight: bold; padding: 6px 10px; background: #C20018; color: #fff; border-radius: 4px; display: inline-block; margin: 8px 0;}
.detail .col2Wrap .right .txt{ font-size: 1.6rem; margin: 8px 0;}
.detail .col2Wrap .right .color{ margin: 15px 0 0;}
.detail .col2Wrap .right .color li{ margin: 0 0 15px; font-size: 1.6rem; line-height: 1.7; overflow: hidden; display: flex; align-content: center; align-items: center;}
.detail .col2Wrap .right .color span{ display: inline-block; float: left;}
.detail .col2Wrap .right .color img{ width: 60px; float: left;}
.detail .col2Wrap .right .color h4{ font-size: 3.2rem; float: left; font-weight: normal; font-family: 'MQ'; line-height: 1; margin: 12px 18px 0;}

@media screen and (max-width: 768px){
   .detail{ margin-top: 0; padding-bottom: 0;}
   .detail .col2Wrap{ display: block; margin: 70px 0; text-align: center; font-size: 1.4rem;}
   .detail .col2Wrap .left{ width: 300px; margin: 0 auto 20px; float: inherit;}
   .detail .col2Wrap .left .w184{ width: 125px; margin: 0;}
   .detail .col2Wrap .right{ width: 100%; margin: 0 auto; text-align: center;}
   .detail .col2Wrap .right h2{ font-size: 4.5rem; margin: 10px 0; text-align: center;}
   .detail .col2Wrap .right .name{ font-size: 1.4rem; line-height: 1.6;}
   .detail .col2Wrap .right h3{ font-size: 1.3rem; margin: 6px 0;}
   .detail .col2Wrap .right .txt{ font-size: 1.3rem; margin: 4px 0;}
   .detail .col2Wrap .right .color li{ margin: 0; font-size: 1.2rem; width: 45%; display: inline-block;}
   .detail .col2Wrap .right .color span{ display: block; float: inherit; width: 90px; margin: 0 auto 8px; overflow: hidden;}
   .detail .col2Wrap .right .color img{ width: 50px;}
   .detail .col2Wrap .right .color h4{ font-size: 2.4rem; margin: 15px 0 0 10px;}
}