
.pc{display: none;}
.sp{display: block;}
.spt20{padding: 20px 0 0}
.mb30{margin-bottom: 15px !important}
.mb50{margin-bottom: 25px !important}
#fb_area .btn a,
.btn a{width: 80%}
*{font-size: 13px;}
.pa{padding: 8vw 0}
#header{height: 15vw}
#header #nav{display: none;}
#header #logo{width:50%;height: 20vw}
#header #logo a{height: 20vw}
#header #nav{height: 100vh;background: #fff;width: 100%;position: fixed;top:0;left:0;}
#header #nav ul.flex{width: 100%;}
#header #nav ul.flex li{margin: 0}
#header #nav ul.flex li a{text-align: center;display: block;padding: 2vh 0;font-size: 2vh;}
#header #nav ul.flex li a:after{display: none;}
#header #nav ul.flex li.hd_btn a{width: 80%;margin:20px auto 0;padding:15px 0;border-radius:10px }
#header #nav ul.flex li.hd_btn a:before{height:16px;width:16px;background:url(../img/i_time.svg) no-repeat center center;background-size:16px 16px;display:inline-block;vertical-align:top;margin-right:5px}

#mainview{margin-top: 15vw}
#mainview p{font-size: 140%;padding: 0 0 1vw;letter-spacing: 0.1em}
#mainview h1{font-size: 100%}
#second #mainview .big{font-size: 140%;}
.slick-dots{bottom: -2vw}
.tl{font-size:140%;margin-bottom:35px }
.sub_tl{font-size: 140%;margin-bottom: 10px;}
.tl:after{bottom: -15px}
.tl_copy{padding-bottom: 20px}
.tl_copy br{display: none;}
.flex{display: block;}
.sec01 li{width: 100%;margin-bottom: 2%}
.sec01 li a{display: flex;align-items: center;}
.sec01 li a p{width: 50%;}
.sec01 li a:hover span.in_btn,
.sec01 li a span.in_btn{width: 50%;padding:10px;margin: 0 10px 0 0}
.sec01 li a span.in_btn p{width: 100%;letter-spacing: 0;text-align: left;padding-right: 10px}
.sec01 li a span.in_btn p br{display: none;}
.sec01 li a span h3{font-size: 130%;padding-bottom: 5px;text-align: left;}
.sec02 li{width: 49%;margin: 0 0 2%}
.sec02 .flex{justify-content: space-between;display: flex;}
.sec02 li a:hover,
.sec02 li a{padding: 15px 10px;letter-spacing: 0}
.sec03 ul{border-top: solid 1px #ccc;}
.sec03 li{width: 100%;}
.sec03 li a{display: flex;align-items: center;}
.sec03 li a img{width: 50%;}
.sec03 li a:hover span,
.sec03 li a span{margin: 0 10px;padding:0 20px 0 0;display: block;width: 50%;letter-spacing: 0}

.sec04 p{letter-spacing: 0}
.sec04 p strong{font-size: 140%;line-height: 160%}

.tablenav{padding-top: 5vw}

.news li a:hover span.news_block,
.news li a span.news_block{margin: 0 15px;padding-right: 25px}
#footer .bnr li a img{height:90px;width:auto;zoom: 60%}
#footer .bnr li:nth-child(2) a img{height:76px}
#footer .bnr li:nth-child(3) a img{height:80px}
#footer .bnr li{width: 70%;margin: 0 auto}
#footer .bnr li:nth-child(2){margin: 2% auto}
#footer .bnr li a{height: 80px}

#fb_area>.flex{display: block;}
#fb_area .right,
#fb_area .left{width: 100%;}
#fb_area .left h3{margin: 0 0 12px;width: 60%}
#fb_area .left dl{display: flex;}
#fb_area .right .flex{display: flex;justify-content: space-between;padding: 15px 0 20px}
#fb_area .right .flex li{width: 48%;margin: 0 0 2%}
#copyright{text-align: center;}
.conversion{-ms-writing-mode: tb-rl;
writing-mode: horizontal-tb;
text-orientation: upright;top: auto;bottom: -1px;left: 20%;width: 60%;z-index: 9}
.conversion a{padding: 15px 0;text-align: center;border-radius: 5px 5px 0 0 ;border-bottom: none;}
.conversion a span{padding:0 0 0 23px;    background: url(../img/i_time.svg) no-repeat left center;background-size: 18px;line-height: 100%;font-size: 120%;}
#fb_area .right table .left{white-space: nowrap;letter-spacing: 0;}
.modal-box{padding: 25px}
.modal-box .btn a{width: 100%;}
.modal-box h3{line-height: 140%}
.scroll{overflow-x:auto }

/*=============================
.btn-trigger
=============================*/
.btn-trigger {
  position: fixed;
  width: 50px;
  height: 44px;
  top:35px;right: 20px;
  cursor: pointer;
  zoom: 50%;
}
.btn-trigger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: #cec800;
  border-radius: 4px;
}
.btn-trigger, .btn-trigger span {
  display: inline-block;
  transition: all .5s;
  box-sizing: border-box;
}
.btn-trigger span:nth-of-type(1) {
  top: 0;
}
.btn-trigger span:nth-of-type(2) {
  top: 20px;
}
.btn-trigger span:nth-of-type(3) {
  bottom: 0;
}
/*=============================
#btn08
=============================*/
#btn08.active span:nth-of-type(1) {
  -webkit-transform: translateY(20px) rotate(-315deg);
  transform: translateY(20px) rotate(-315deg);
}
#btn08.active span:nth-of-type(2) {
  opacity: 0;
}
#btn08.active span:nth-of-type(3) {
  -webkit-transform: translateY(-20px) rotate(315deg);
  transform: translateY(-20px) rotate(315deg);
}

.ca_sec01 .flex p.image,
.ca_sec01 .flex p.copy{width: 100%;}
.ca_sec01 .flex p.copy{padding: 20px;}
.ca_sec02 dt{font-size: 130%}
.content-box{padding: 20px}
.content-box dl{padding: 20px;display: block;min-height: 0}
.content-box dl dt,
.content-box dl dd{display: block;width: 100%}
.content-box dl dt span br{display: none;}
.content-box dl dt{border-bottom: dotted 1px #cec800;margin: 0 0 15px;padding: 0 0 15px;text-align: center;}
.ca_sec03 .box2 li{width: 100%;height: 150px;margin-bottom: 2%}
.ca_sec03 .box3 li{width: 100%;margin-bottom: 2%;height: 120px}
table th, table td{letter-spacing: 0}
.ca_sec05 li{width: 100%;}
.ca_sec06 .image{width: 65%;margin: 0 auto 30px}
.ca_sec06 .copy{width: 100%;}
.ca_sec06 .copy h3.sub_tl:last-child{margin: 20px 0 0}
.ca_sec04 table{width: 650px}

.st_sec01 .flex{display: flex;}
.st_sec01 li{width: 49%;padding: 15px 10px}
.st_sec08 .flex{display: flex;flex-wrap: wrap;}
.st_sec08 .flex li{width: 49%;padding: 15px 10px;margin: 0 0 2%}
.st_sec09 .check li{padding-left: 30px}
.st_sec09 .check li:before{left: 8px}

.my_sec02 .image{padding:5vw 5vw 5vw 40vw;}
.my_sec02 .image dl dt{padding: 0 0 10px;line-height: 140%;font-size: 140%}
.my_sec02 .image dl{padding-top:15px; }
.my_sec02 .image dl:first-child{padding: 0 0 15px 0}
.my_sec03 .image {height: 220px}
.my_sec03 .image p{font-size: 100%;line-height: 160%;padding:12px;width: 54%}
.my_sec03 .image p br{display: none;}

.my_sec04 li{width: 100%;margin: 0 0 2%}
.my_sec04 li dl{padding: 15px 22px}
.my_sec05 .flex .image, .my_sec05 .flex div{width: 100%;}
.my_sec05 .sub_tl{margin: 0 0 15px;font-size: 120%}
.my_sec05 .flex .image{margin-bottom: 15px}
.my_sec05 .flex div dd{margin-bottom: 10px}
.my_sec05 .howto{display: flex;}
.my_sec05 .howto li{height: 28vw}
.my_sec05 .note,
.my_sec05 .howto{margin-top: 15px;}
.my_sec06 .flex p{width: 100%;margin-bottom: 15px}
.fin{font-size: 140%;padding: 25px 0}
.fin br{display: none;}

.page-template-page-myopia2 .my_sec05 strong.tl_copy{line-height: 140%;padding: 0 0 10px}
.page-template-page-myopia2 .con{margin-bottom: 25px;padding: 25px;}
.page-template-page-myopia2 .con li:first-child.btn{margin-bottom: 15px}
.page-template-page-myopia2 .con li.btn{width: 100%;}
.page-template-page-myopia2 .con li .min{font-size: 120%}
.page-template-page-myopia2 .con li a{margin-top:10px;}
.page-template-page-myopia2 .con li a span{padding:0 30px 0 0}

.me_sec01 .flex li{width: 100%;}

.do_sec01 .photo{width: 100%;margin-bottom: 20px;}
.do_sec01 .copy{width: 100%;}
.cl_sec01 .flex{display: flex;}
.cl_sec01 li{width: 49%;margin: 0 0 2%;}
.cl_sec01 h3{margin-bottom: 10px}
.cl_sec01 table{margin-bottom: 25px !important}
.cl_sec02 .image{width: 100%;}
.cl_sec02 .copy{width: 100%;padding: 15px;}
.cl_sec02 ul.flex li{width: 100%;}
.cl_sec02 div.flex{margin-bottom: 2%;}
.cl_sec03 .block{padding:20px;}
.cl_sec03 .block h2{margin-bottom: 15px;line-height: 140%;}
.cl_sec03 .block .image, .cl_sec03 .block .copy{width: 100%;}
.cl_sec03 .block .image{margin-bottom: 15px;}
.cl_sec03 .btn a{width: 90%}

.page-template-page-recruit .sub_nav.flex{display: flex;flex-wrap: wrap;}
.page-template-page-recruit .sub_nav.flex li{width:25%;margin: 0;}
.page-template-page-recruit .sub_nav.flex li a{letter-spacing: 0;text-align: center;padding: 10px 0 20px 0;background: url(../img/arw_d.svg) center 32px no-repeat;background-size: 10px;}
.re_sec03 .flex{padding: 6vw 0}
.re_sec03 .flex div{width: 100%;}
.re_sec03 .flex div strong{font-size: 8vw;padding:3vw 0}
.re_sec03 .flex div.left{margin-bottom: 5vw}
.re_sec04 table{border:solid 1px #ccc;border-bottom: none;}
.re_sec04 table th,
.re_sec04 table td{display: block;width: 100%;height: auto;padding: 15px;border: none;float: none;}
.re_sec04 table td{border-bottom: solid 1px #ccc;}
.re_sec04 table td input{width: 100%;}
.re_sec04 table td label input{width: auto;margin: 0 2px 0 0}

.page-template-page-privacy .pab.center br{display: none;}
.privacy_area div.dis{padding: 20px}
.privacy_area h2{font-size: 120%;padding: 0 0 12px}
.privacy_area div.dis{margin-bottom: 6vw}

.single .block800{padding: 20px}
.single .block800 h3{font-size: 120%;margin-bottom: 10px;padding-bottom: 10px;line-height: 130%}