/* webfont */
@font-face {
    font-family: 'gsl';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'gsm';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'gsb';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


/* reset */
* { margin: 0; padding:0; }
li { list-style:none; }
a { text-decoration: none !important; color:inherit; }
img { vertical-align: top; }

/* common */
html { overflow-x: hidden; }
body { font:16px/1.6 gsm; }
.wrap { width:1200px; margin:0 auto; position: relative; }
.wrap * { word-break: keep-all; }
.wrap:after, ul:after, .cl:after { content:""; clear:both; display: block; }
.blind { position:absolute; width:0; height:0; font-size:0; overflow: hidden; }
.fl { display: flex; align-items: center; justify-content: center; }
.fl:after { display:none; }
.dn { display:none !important; }


/* header */
header { position: fixed; width: 100%; left: 0; top: 0; height: 80px; z-index: 99; background: #fff; border-bottom:1px solid #ddd;  }
header h1 { padding-top: 15px; }
header ul { font-size:12px; text-transform: uppercase; position: absolute; right:50px; top:32px; }
header ul li { float:left; }
header ul li:after { content:"|"; margin:0 16px;  }
header ul li:last-child:after { display: none; }
header .menu { position: absolute; right:0; top:30px; }

/* index */
#fullpage .step { justify-content: space-between; }
#fullpage .step article { width: 500px; }
#fullpage .step article h4 { font:42px gsb; }
#fullpage .step article ul { margin-top: 80px; border-top:1px solid #000; border-bottom:1px solid #000; padding:10px 0; }
#fullpage .step article ul li { float:left; width:48%; margin-right: 4%; position: relative; box-sizing: border-box; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding:10px 0 10px 14px; }
#fullpage .step article ul li:before { content:"·"; position: absolute; left: 0; }
#fullpage .step article ul li:nth-child(2n) { margin-right: 0; }
#fullpage .step article ul li:nth-child(2n+1) { clear: both; }

#fullpage > div:nth-of-type(2n) .step { flex-direction: row-reverse; }

#spring h3 { font:50px gsb; text-align: center; }
#spring p { text-align: center; margin-top: 10px; margin-bottom: 80px;  }
#spring p strong { font:18px gsb; }

#inquiry .list { justify-content: space-between; align-items: flex-start; text-align: center; }
#inquiry .list > li { width: 240px; }
#inquiry .list li h3 { font:28px gsb; }
#inquiry .list li:nth-child(1) h3:first-letter { color:#f293bd; }
#inquiry .list li:nth-child(2) h3:first-letter { color:#80d6af; }
#inquiry .list li:nth-child(3) h3:first-letter { color:#edb1a6; }
#inquiry .list li:nth-child(4) h3:first-letter { color:#8ab6e7; }

#inquiry .list ul li { border-width:2px; border-style:solid; font:20px/50px gsm; border-radius: 10px 0 0 0; position: relative; margin-top: 56px; background: #fff; height: 46px; }
#inquiry .list > li:nth-child(1) ul li { border-color:#f293bd; }
#inquiry .list > li:nth-child(2) ul li { border-color:#80d6af; }
#inquiry .list > li:nth-child(3) ul li { border-color:#edb1a6; }
#inquiry .list > li:nth-child(4) ul li { border-color:#8ab6e7; }

#inquiry .list > li ul { margin-top: 90px; }
#inquiry .list > li ul li:before { content:""; background-repeat:no-repeat; background-position:center bottom; width: 17px; height: 68px; position: absolute; top:-80px; left:calc(50% - 9px); z-index:-1; }
#inquiry .list > li:nth-child(1) ul li:before { background-image:url(../images/arrow1.jpg); }
#inquiry .list > li:nth-child(2) ul li:before { background-image:url(../images/arrow2.jpg); }
#inquiry .list > li:nth-child(3) ul li:before { background-image:url(../images/arrow3.jpg); }
#inquiry .list > li:nth-child(4) ul li:before { background-image:url(../images/arrow4.jpg); }
#inquiry .inq { width: 300px; font:28px/60px gsb; color:#fff; background: #89b8e6; border-radius: 10px 0; display: block; margin:80px auto 0; text-align: center; }