/* ==== mob ==== */
@media screen and (max-width:767px){
body,th,td,input,select,textarea,button {font-size:12px; line-height:1.5;}
.inner {width:100%; padding:0 3%;}
.pc {display:none !important;}
.tab {display:none}
.mob {display:block !important;}
.pc_img {display:none;}
.mob_img {display:block;}

body,th,td,input,select,textarea,button {font-size:13px; line-height:20px;}

/* === Main === */
#wrap {position:relative; width:100%; max-width:767px; min-width:auto; margin:0 auto; overflow:hidden;}
#header {position:fixed; top:0; left:0; width:100%; height:60px; z-index: 10;}
#header h1 img {position:absolute; left:3%; top: 15px; height: 31px;}
.gnb {display:none;}

.navi {display:none; position:fixed; top:60px;}
.lnb h3 {position: relative; width:100%; height:45px; padding:0 10px;}
.lnb h3 a {font-size:13px;line-height:45px}
.sub_navi {display:none; padding:10px;}
.sub_navi li a {line-height:25px; font-size:13px;}

.navi_btn {position:fixed; display:block; top:22px; right:3%; height:16px; width:21px; cursor:pointer; z-index:9999;}
.navi_btn span {position:absolute; display:block; width:100%; height:2px; background:#000;  transition: .25s ease-in-out;}
.navi_btn span:first-child {margin-top:0;}
.navi_btn span:nth-child(1) {top:0}
.navi_btn span:nth-child(2) {top:7px;}
.navi_btn span:nth-child(3) {top:14px;}

.navi_btn.on span:nth-child(2) {opacity:0; transition:0.3s ease-in-out; width: 0%;}
.navi_btn.on span:nth-child(1) {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); 
transform: rotate(45deg); top:7px; left:0px;}
.navi_btn.on span:nth-child(3) {-webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); 
transform: rotate(-45deg); top:7px; left:0px;}


.lnb .join_wrap_mob {margin-top: 20px; margin-left: 10px;}
.lnb .join_wrap_mob a {display:inline-block; font-size: 12px; line-height: 28px; }
.lnb .join_wrap_mob .orderBtn {font-size: 12px; font-weight: bold; margin-right: 15px; border:1px solid #D50004; padding: 7px 13px 7px 10px;}
.lnb .join_wrap_mob .loginBtn {margin-right: 4px; padding-right: 10px; position:relative;}
.lnb .join_wrap_mob .loginBtn::after {content:''; width:1px; height: 10px; background: #999; position:absolute; right:0; top:8px;}
.lnb .join_wrap_mob > div {display:inline-block;}


.visual {background: url(../images/main/main_visual.jpg) no-repeat center bottom / cover;}
.visual .inner .text {width: 100%; padding: 0 3%;}
.visual .inner .text h2 {font-size:18px; line-height:38px;}
.visual .inner .text h2 strong {font-size:30px;}
.visual .inner .text p {font-size:13px; line-height:25px; margin-top:20px; padding-top:20px;}
.visual .inner .text p::before {width:60px; height: 2px;}

.title span {color: #D50004; font-size: 13px; margin-bottom:15px;}
.title h2 {color: #222; font-size:25px;}

.section1 {width:100%; background: url(../images/main/sec1_bg.jpg) no-repeat center center / cover; padding:25px 0;}
.section1 .title, .section1 .right {float:none; width:100%;}
.section1 .title span {font-size:15px; margin-bottom:15px;}
.section1 .title h2 {font-size:23px; line-height:34px;}
.section1 .right p {font-size:13px; line-height:23px; margin-top:15px; word-break:keep-all;}

.section2 {padding:25px 0;}
.section2 .title {margin-bottom:25px;}

.section2 .b_list li {float:none; width:100%; height:150px;}
.section2 .b_list li:first-child {background: url(../images/main/sec2_01.jpg) no-repeat center center / cover; }
.section2 .b_list li:nth-child(2) {background: url(../images/main/sec2_02.jpg) no-repeat center center / cover; transform:translateY(0px);}
.section2 .b_list li:nth-child(3) {background: url(../images/main/sec2_03.jpg) no-repeat center center / cover;}
.section2 .b_list li:nth-child(4) {background: url(../images/main/sec2_04.jpg) no-repeat center center / cover; transform:translateY(0px);}
.section2 .b_list li h3 {font-size:17px; left:10px; bottom:30px;}
.section2 .b_list li h3::after {width:30px; bottom:-13px;}

.section2 .inner > img {display:block; margin:35px auto; height:40px;}

.section2 .b_list2 {border-top:2px solid #BABABA; border-bottom:1px solid #EAEAEA; width:100%; padding:0;}
.section2 .b_list2 li {float:none; width:100%; padding:20px 10px; position:relative; height:130px; border-right:0; border-top:1px solid #eaeaea;}
.section2 .b_list2 li:nth-child(-n+2){border-bottom:0;}
.section2 .b_list2 li:first-child{border-top:0;}
.section2 .b_list2 li h3 {font-size:14px; line-height:20px;}
.section2 .b_list2 li .btn {position:absolute; bottom:20px; line-height: 1; width: 100%; left: 0; padding: 0 10px;}
.section2 .b_list2 li .btn span {font-size:13px;}
.section2 .b_list2 li .btn img {right:10px; height:15px;}

.section3 {background:url(../images/main/sec3_bg.jpg) no-repeat center center / cover ; padding:25px 0;}
.section3 .title {margin-bottom:20px;}
.section3 .arrow_btns {font-size:0;}
.section3 .arrow_btns button {line-height:0;}
.section3 .arrow_btns img {height:14px;}
.section3 .arrow_btns button:first-child {margin-right:15px; padding-right:15px; position:relative;}
.section3 .arrow_btns button:first-child::before {content:''; width:1px; height: 10px; background:#BEBEBE; position:absolute; right:0; top:2px;}
.section3 .p_list {margin-top:10px;}
.section3 .p_list li {border:0; border-right:1px solid #D8D8D8; width:50%; height:130px; background: #fff; position:relative;}
.section3 .p_list li img {position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); max-width:100%; width:99%;}

.section4 {width: 100%; padding-top:25px;}
.section4 .title p {margin-top: 20px; font-size:13px; line-height:21px;}
.section4 .title p strong {color: #222;}
.section4 iframe {width: 100%; height:300px; margin-top:20px;}

.top_btn {position:fixed; right:3%; bottom:40px; width:70px; height: 70px; background: #D50004; border-radius:50%; text-align: center; line-height: 70px;}
.top_btn a {font-size: 18px; font-weight: bold; color: #fff; display:block; width: 100%; height: 100%;}

#footer {padding:20px 0;}
#footer p {font-size:12px; line-height:20px; color: #919191;}
#footer p span {margin: 0 5px;}
#footer p.copyright {color: #fff; margin-top:10px;}


}
