
@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@charset "utf-8";

/* sub visual */
#sub-visual {height:330px;background:#666 no-repeat 50% 50%;background-size:cover;position:relative;}
#sub-visual:before {content:'';display:block;position:absolute;left:0;top:0;width:100%;height:100%;opacity:0.3;background:#181818;}
#sub-visual .inner {color:#fff;text-align:center;padding-top:170px;font-weight:500;font-size:42px;position:relative;z-index:2;text-shadow:#636363 0 0 20px;}
#sub-visual .inner div {font-size:14px;font-weight:normal;padding-top:15px;}
/* sub visual - change background image */
.sub1 #sub-visual {background-image:url(/assets/img/sub/sub-visual01.jpg);}
.sub2 #sub-visual {background-image:url(/assets/img/sub/sub-visual03.jpg);}
.sub3 #sub-visual {background-image:url(/assets/img/sub/sub-visual04.jpg);}
.sub4 #sub-visual {background-image:url(/assets/img/sub/sub-visual05.jpg);}
.sub5 #sub-visual {background-image:url(/assets/img/sub/sub-visual02.jpg);}
.sub6 #sub-visual {background-image:url(/assets/img/sub/sub-visual06.jpg);}

/* site location - Visual Identity color apply - #12973c;  */
#site-loc {position:relative;z-index:5;}
#site-loc .no-text {display:inline-block;width:1px;height:1px;overflow:hidden;padding:10px;text-indent:-1000px;}
#site-loc .inner {position:absolute;left:0;top:-30px;width:100%;padding:0 10px;background-color: #12973c;}
#site-loc .loc-wrap {width:100%;max-width:1200px;/*background:#004386*/;margin:0 auto;border-radius: 30px;/*background: linear-gradient( 45deg , rgb(10, 127, 181) 20%, rgb(0, 104, 181) 0%, rgb(0, 143, 76) 80%, rgb(183, 136, 9) 0%), url(#) no-repeat 50% -150px;*/}
#site-loc .loc-wrap > ul {display:block;width:100%;padding:0;margin:0;list-style:none;}
#site-loc .loc-wrap > ul:after {content:'';clear:both;display:table;}
#site-loc .loc-wrap > ul > li {float:left;}
#site-loc .loc-home {width:60px;}
#site-loc .loc-home a {display:block;width:100%;height:60px;background:url(../img/loc_home.png) no-repeat center;border-right:solid 1px #48af68;}
#site-loc .loc-link {position:relative;}
#site-loc .loc-link > a {display:block;height:60px;line-height:60px;color:#fff;text-decoration:none;padding:0 20px;border-right:solid 1px #48af68;}
#site-loc .loc-link > a > span {display:block;font-size: 18px;min-width:180px;background:url(../img/loc_arrow.png) no-repeat right;padding-right:15px;white-space:nowrap;}
#site-loc .loc-link .loc-sub {position:absolute;left:0;top:100%;width:100%;background:#12973c;display:none;/*background: linear-gradient( 45deg , rgb(10, 127, 181) 0%, rgb(0, 104, 181) 0%, rgb(0, 143, 76) 100%, rgb(183 136 9 / 0%) 0%), url(#) 50% -150px no-repeat;*/}
#site-loc .loc-link .loc-sub ul {display:block;padding:0 0 20px 0;margin:0;list-style:none;}
#site-loc .loc-link .loc-sub li {display:block;float:none;}
#site-loc .loc-link .loc-sub a {display:block;padding:10px 0px 8px 25px;;color:#fff;text-decoration:none;}
#site-loc .loc-link .loc-sub a:hover {text-decoration:underline;}
/* site location - share buttons */
#site-loc .loc-wrap li.loc-right {float:right;position:relative;z-index:2;padding-right:16px;}
#site-loc .loc-right > a {display:block;width:40px;height:60px;float:left;}
#site-loc .loc-share {background:url(../img/loc_share.png) no-repeat center;border-left-width:0;}
#site-loc .loc-print {background:url(../img/loc_print.png) no-repeat center;}
#site-loc .loc-share-sub {position:absolute;right:100%;top:15px;display:none;}
#site-loc .loc-share-sub ul {display:block;width:auto;white-space:nowrap;padding:0;margin:0;list-style:none;}
#site-loc .loc-share-sub li {display:inline;}
/* site location - fix to top */
#site-loc .inner {transition:all .2s;}
.fix-loc #site-loc {position:fixed;left:0;top:0;width:100%;}
.fix-loc #site-loc .inner {/*background: linear-gradient( 45deg , rgb(10, 127, 181) 20%, rgb(0, 104, 181) 0%, rgb(0, 143, 76) 80%, rgb(183, 136, 9) 0%), url(#) no-repeat 50% -150px;*/top:0;}


/* less than 1200px */
@media all and (max-width:1200px) {
    /* site location - remove padding when fixed */
    .fix-loc #site-loc .inner {padding:0;}

    /* site location - change sns share icon position */
    #site-loc .loc-share-sub {right:0;top:110%;}
	.title{font-size:42px}
	.pageWrap .pwrap{width:95%;margin-top:50px}
}

/* less than 1024px */
@media all and (max-width:1024px) {
    /* site location */
    #site-loc .loc-wrap > ul {display:table;table-layout:fixed;}
    #site-loc .loc-wrap > ul:after {display:none;}
    #site-loc .loc-wrap > ul > li {display:table-cell;float:none;vertical-align:middle;}
    #site-loc .loc-wrap > ul > li.loc-right {width:80px;float:none;padding-right:0;}
    #site-loc .loc-link > a > span {min-width:auto;overflow:hidden;text-overflow:ellipsis;}
}

/* less than 640px */
@media all and (max-width:640px) {
    /* sub visual - change height */
    #sub-visual {height:240px;}
    #sub-visual .inner {padding-top:120px;font-size: 30px; letter-spacing:-1px; padding-left:20px; padding-right:20px; line-height:1;}

    /* site location - change height */
	.pageWrap{font-size:15px}
    #site-loc .inner {top:-20px;}
    #site-loc .loc-home {width:60px;}
    #site-loc .loc-wrap > ul > li.loc-right {width:70px;}
    #site-loc .loc-right > a {width:26px;}
    #site-loc .loc-link > a {padding:0 10px;}
    #site-loc .loc-link .loc-sub a {padding-left:10px;}
    #site-loc .loc-home a,
    #site-loc .loc-link > a,
    #site-loc .loc-right > a {height:55px;line-height:55px;}
    /* site location - show only last path */
    #site-loc .loc-right > a {background-size:18px;}
    #site-loc .loc-wrap > ul > li.loc-link {display:none;}
    #site-loc .loc-wrap > ul > li:nth-last-child(2) {display:table-cell;}
}

/* less than480px */
@media all and (max-width480px) {
    /* sub visual - change height */
    #sub-visual {height:240px;}
    #sub-visual .inner {padding-top:120px;font-size: 35px;}

    /* site location - change height */
	.pageWrap{font-size:15px}
    #site-loc .inner {top:-20px;}
    #site-loc .loc-home {width:40px;}
    #site-loc .loc-wrap > ul > li.loc-right {width:70px;}
    #site-loc .loc-right > a {width:26px;}
    #site-loc .loc-link > a {padding:0 10px;}
    #site-loc .loc-link .loc-sub a {padding-left:10px;}
    #site-loc .loc-home a,
    #site-loc .loc-link > a,
    #site-loc .loc-right > a {height:55px;line-height:55px;}
    /* site location - show only last path */
    #site-loc .loc-right > a {background-size:18px;}
    #site-loc .loc-wrap > ul > li.loc-link {display:none;}
    #site-loc .loc-wrap > ul > li:nth-last-child(2) {display:table-cell;}
}

