@CHARSET "UTF-8";

#container.shop h3 { top: 50px; }
#container.shop h4 { margin: 0 0 15px 0; line-height: normal; font-size: 20px; font-weight: 500; color: #414141; }
#container.shop .content .content_wrap { padding: 10% 0; }

/* HEADER **********************************************************/
.shop .header {background: url(../images/shop/bg_header.jpg) no-repeat top center; background-size: cover;}

/* CONTENT **********************************************************/
.shop .cont_top { margin: 0 0 70px 0; overflow: hidden; }
.shop .cont_top .thumb { position: relative; float: left; width: 430px; margin: 0 50px 0 0; }
.shop .cont_top .slider { width: 100% }
.shop .cont_top .pager { position: absolute; top: 0px; right: -160px; }
.shop .cont_top .pager .bx-pager-item { display: inline-block; *display: inline; zoom: 1; vertical-align: top; }
.shop .cont_top .pager a { display: block; width: 55px; height: auto; font-size: 0px; text-indent: -9999px; border-top: 7px solid #cecece; }
.shop .cont_top .pager a.active { border-top: 7px solid #0089d0 }
.shop .cont_top .info { padding: 40px 0 0 0 }
.shop .cont_top .info .subject { width: 900px; margin: 0 0 10px 0; line-height: 40px; font-size: 30px; font-weight: 500; color: #0089d0; word-break: keep-all; }
.shop .cont_top .info .desc { width: 1110px; line-height: 26px; font-size: 16px; font-weight: 300; color: #585858; word-break: keep-all; }
.shop .tab .tab_header li { width: 25% }
.shop .tbl_notice { width: 100% }
.shop .tbl_notice thead th { font-size: 15px; border-left: 1px solid #e1e1e1; }
.shop .tbl_notice thead th:FIRST-CHILD { border-left: none }
.shop .tbl_notice tbody th { font-size: 15px; font-weight: 300; color: #3a3a3a; background: #f5f5f5; }
.shop .tbl_notice tbody td { padding: 12px 25px; font-size: 15px; border-left: 1px solid #e1e1e1; }
.shop .tbl_notice tbody td.vt_t { vertical-align: top }
.shop .tbl_notice tbody td .lst_info li { padding: 0 0 0 15px; background: url(../images/shop/ico_blot.png) no-repeat left 8px; }
.shop .tbl_notice.tbl_v_p { display: table }
.shop .tbl_notice.tbl_v_m { display: none }
.shop .lst_process { padding: 40px 60px; background: #fafafa; }
.shop .lst_process:AFTER { content: ""; display: block; clear: both; }
.shop .lst_process li { position: relative; float: left; width: 25.33%; padding: 25px 4%; }
.shop .lst_process li.step4, .shop .lst_process li.step5, .shop .lst_process li.step6 { float: right }
.shop .lst_process li:AFTER { content: ""; position: absolute; display: block; width: 14px; height: 14px; background: url(../images/shop/ico_process_arrow.png) no-repeat 0px 0px; }
.shop .lst_process li.step1:AFTER, .shop .lst_process li.step2:AFTER, .shop .lst_process li.step7:AFTER { top: 50%; right: -7px; margin: -7px 0 0 0; background-position: 0px 0px; }
.shop .lst_process li.step4:AFTER, .shop .lst_process li.step5:AFTER { top: 50%; left: -7px; margin: -7px 0 0 0; background-position: -14px 0px; }
.shop .lst_process li.step3:AFTER, .shop .lst_process li.step6:AFTER { top: 95%; left: 22%; background-position: -28px 0px; }
.shop .lst_process li.step8:AFTER { display: none }
.shop .lst_process li .thumb { float: left; width: 30%; max-width: 86px; margin: 0 5% 0 0; }
.shop .lst_process li .thumb img { display: block; width: 100%; }
.shop .lst_process li .cont .tit { line-height: 30px; font-size: 20px; font-weight: 700; color: #0089d0; }
.shop .lst_process li .cont .desc { line-height: 20px; font-size: 14px; font-weight: 300; color: #585858; word-break: keep-all; }
.shop .lst_qna { margin: 0 0 0 -6px }
.shop .lst_qna:AFTER { content: ""; display: block; clear: both; }
.shop .lst_qna li { box-sizing: border-box; position: relative; float: left; width: 33.33%; border-left: 6px solid #fff; margin: 0 0 5px 0; background: #f5f5f5 url(../images/shop/bg_qna.png) no-repeat 20px 0px; }
.shop .lst_qna li .info { margin: 0 0 20px 0; padding: 28px 45px 0 45px; }
.shop .lst_qna li .info .country { margin: 0 0 3px 0; line-height: 1; font-size: 16px; font-weight: 300; color: #585858; }
.shop .lst_qna li .info .name { line-height: 1; font-size: 30px; font-weight: 500; color: #0089d0; }
.shop .lst_qna li .contact { padding: 0 45px 20px 45px }
.shop .lst_qna li .contact p { line-height: 24px; font-size: 16px; font-weight: 300; color: #585858; }
.shop .lst_qna li .contact p a { margin: 0 0 0 5px }

@media screen and (max-width:1200px) {
	.shop .cont_top .info .subject { width: auto }
	.shop .cont_top .info .desc { width: auto }
	.shop .lst_process { padding: 20px }
	.shop .lst_process li { width: 29.33%; padding: 25px 2%; }
	.shop .lst_process li.step3:AFTER, .shop .lst_process li.step6:AFTER { left: 17% }
	.shop .lst_qna li .info { padding: 28px 30px 0 30px }
	.shop .lst_qna li .contact { padding: 0 30px 20px 30px }
}

@media screen and (max-width:1024px) {
	.shop .cont_top .thumb { float: none; width: 100%; max-width: 600px; margin: 0 auto 50px auto; }
	.shop .cont_top .pager { position: relative; top: 0px; right: 0px; margin: 10px 0 0 0; }
	.shop .cont_top .info { padding: 0 }
	.shop .lst_process li { width: 42%; padding: 25px 4%; }
	.shop .lst_process li.step4, .shop .lst_process li.step5, .shop .lst_process li.step6 { float: left }
	.shop .lst_process li.step1:AFTER, .shop .lst_process li.step3:AFTER, .shop .lst_process li.step5:AFTER { top: 100%; left: inherit; right: -7px; margin: -7px 0 0 0; background-position: -28px 0px; }
	.shop .lst_process li.step2:AFTER, .shop .lst_process li.step4:AFTER, .shop .lst_process li.step6:AFTER, .shop .lst_process li.step7:AFTER { display: none }
	.shop .lst_qna li { width: 50% }
}

@media screen and (max-width:768px) {
	.shop .tab .tab_header li { width: 28% }
	.shop .tab .tab_header li.btn_tab_04 { width: 16% }
	.shop .tbl_notice.tbl_v_p { display: none }
	.shop .tbl_notice.tbl_v_m { display: table }
	.shop .lst_process { padding: 0 }
	.shop .lst_process li { width: 46%; padding: 25px 2%; }
	.shop .lst_process li .cont .tit { line-height: normal; font-size: 3.2vw; }
	.shop .lst_process li .cont .desc { line-height: normal; font-size: 2.2vw; height: 36px; }
	.shop .lst_qna li { width: 100% }
	.shop .lst_qna li .info .country { font-size: 2.5vw }
	.shop .lst_qna li .info .name { font-size: 4.8vw }
	.shop .lst_qna li .contact p { font-size: 2.5vw }
}

@media screen and (max-width:640px) {
	.shop .lst_process li .thumb { width: 25%; margin: 0 5% 0 0; }
}

@media screen and (max-width:480px) {
	.shop .lst_process li { width: 96% }
	.shop .lst_process li:AFTER { content: ""; position: absolute; top: 100% !important; left: 50% !important; display: block !important; width: 14px; height: 14px; margin: -14px 0 0 -7px !important; background: url(../images/shop/ico_process_arrow.png) no-repeat -28px 0px !important; }
	.shop .lst_process li.step8:AFTER { display: none !important }
}