html,body {padding:0;margin:0;width:100%;height:100%}
* {box-sizing:border-box}
body {background:#fff;color:#000;font-family:'Athiti','Kanit',Tahoma,Arial,sans-serif;font-size:18px}
a,a:hover,a:focus,a:active {text-decoration:none;transition:.5s all}
b,strong {font-weight:600}
/* #000 #178f47 #277552 #fff */

/* ===== Main CSS ===== */
#top {padding-top:120px}
.pc-menu {position:fixed;top:0;left:0;right:0;background:#fff;width:100%;padding:12px;box-shadow:0 1px 4px #178f4724;z-index:100}
.pc-menu .nlogo {float:left;width:180px;height:96px;text-align:center}
.pc-menu .nlogo img {display:inline-block;margin:0 auto}
.pc-menu .navi {float:right;width:calc(100% - 240px);height:96px;text-align:right;white-space:nowrap;padding:24px 36px}
.pc-menu .navi a {display:inline-block;padding:0 32px;border-radius:18px;color:#277552;font-size:24px;font-weight:600}
.pc-menu .navi a.active {background:#080 linear-gradient(to top,#178f47,#277552);color:#fff}

.sm-menu {position:fixed;top:0;left:0;right:0;background:#fff;width:100%;padding:12px;box-shadow:0 1px 4px #178f4724;z-index:101}
.sm-menu .nlogo {float:left;width:140px;height:80px;text-align:center}
.sm-menu .nlogo img {display:inline-block;margin:0 auto}
.nbars {position:absolute;right:48px;top:50%;transform:translateY(-50%)}
.nbars {width:32px;height:28px;cursor:pointer;border-top:4px solid #178f47;border-bottom:4px solid #178f47}
.nbars:after {position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:block;content:'';width:32px;height:4px;background:#178f47;margin:0 auto}

.minimenu {position:fixed;top:0;left:0;right:0;background:#fff;width:100%;height:100vh;padding:160px 32px 0;background:#fdfffd;z-index:99;overflow:hidden;opacity:1;transition:.5s all}
.minimenu a {display:block;margin:16px auto;height:48px;line-height:48px;text-align:center;font-size:24px;font-weight:600}
.minimenu a {background:#fff;border:2px solid #277552;border-radius:18px;color:#277552}
.minimenu a.active {background:#080 linear-gradient(to top,#178f47,#277552);color:#fff}
.minimenu.inactive {height:0px;opacity:0}

.viewport-apply,.viewport-about,.viewport-agent,.viewport-contact {width:1px;height:1px;position:absolute;top:120px;left:0;overflow:hidden;z-index:2}
#apply,#about,#agent,#contact {width:1px;height:1px;position:absolute;top:-108px;left:0;overflow:hidden;z-index:1}
#sk-apply,#sk-about,#sk-agent,#sk-contact {position:relative;padding:48px 32px}
.ask-intro {margin:0 auto;text-align:center;max-width:1440px;letter-spacing:-1px}
.ask-intro h1,.ask-intro h2,.ask-intro p:first-of-type {color:#277552;font-weight:600;margin:8px auto}
.ask-intro p {margin:16px auto}
.ts48 {font-size:48px}
.ts40 {font-size:40px}
.ts32 {font-size:32px}
.ts24 {font-size:24px}
.ts16 {font-size:16px}

.please {color:#277552;padding:8px 0 16px;font-size:18px}

.request-form {padding:24px 128px;width:100%;max-width:1360px;margin:32px auto 48px;background:#f5f5f5;border-radius:32px}

.agent-ready {padding:24px;width:100%;max-width:1360px;margin:0 auto}
.agent-imgs {float:left}
.agent-form {float:right}
.agent-imgs,
.agent-form {width:45%}
.agent-imgs img {width:100%}

.skg-contain,.skc-contain {position:relative;text-align:center}
.skg-contain .skg-imgs {display:inline-block;margin:0 auto}
.skg-contain .skg-imgs {max-width:360px;width:25%}
.skg-contain .skg-imgs img {width:360px;max-width:100%}
.skc-contain .skc-imgs {display:inline-block;margin:0 auto}
.skc-contain .skc-imgs {max-width:288px;width:16.66%}
.skc-contain .skc-imgs img {width:288px;max-width:100%}

.contact-ft {color:#277552}
.tri-row {position:relative}
.tri-col {float:left;width:33.33%;padding:24px}
.tri-col:nth-child(1) {text-align:right}
.tri-col:nth-child(2) {text-align:center}
.tri-col:nth-child(3) {text-align:left}
.tri-col:nth-child(2) img {display:inline-block;width:40%;margin:12px auto 0}
.tri-col-1 {text-align:center}
.tri-col-1 > img {display:inline-block;width:33.33%;max-width:256px;margin:12px auto 0}
.contact-ft h3 {padding-top:20px}
.contact-ft .sns {padding:80px 0}
.contact-ft .tri-col-1 .sns {padding:0 0 48px}

.skpop,.skpop * {text-align:center;transition:.5s all}
.skpop {position:fixed;left:0;right:0;top:0;width:100%;height:100vh;overflow:hidden;z-index:998}
.skpop-in {position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);margin:0 auto;width:96%;max-width:384px;padding:32px 24px;border-radius:16px;z-index:999}
.skpop {background:#000e;opacity:0;display:none}
.skpop-in {background:#fff}
.skpop.active {opacity:1;display:block}
.skpop .data {color:#277552}
.skpop .btn {border-radius:8px;height:32px;line-height:24px;font-size:20px;padding:0 32px;border:2px solid #277552;background:#080 linear-gradient(to top,#0d2c1c,#277552);color:#fff;text-align:center;cursor:pointer;font-weight:600;margin:16px auto}
.skpop .btn:hover {border:2px solid #277552;background:#fff;color:#277552}

/* ===== Form Decoration ===== */
input,button,select {font-family:inherit;background:#fff;transition:.3s all;border-radius:12px;display:inline-block;padding:0 16px}
input,select {height:40px;line-height:40px;font-size:20px;border:2px solid #d9d9d9;color:#080}
input:focus {background:#f5fff5}
button {height:48px;line-height:32px;font-size:24px;border:2px solid #277552;background:#080 linear-gradient(to top,#0d2c1c,#277552);color:#fff;text-align:center;cursor:pointer;font-weight:600;margin:16px auto}
button:hover {border:2px solid #277552;background:#fff;color:#277552}
input:valid,select:valid {border-color:#d9d9d9}
input:invalid,select:invalid {border-color:#494}

.text-in {padding:8px 0}
.text-in input,.text-in select {width:100%}
.text-special {position:relative}
.text-special select {float:left;width:108px}
.text-special input {float:right;width:calc(100% - 120px)}
.check-options {padding:16px 0;white-space:nowrap}

/* ===== After Clear Both ===== */
.pc-menu:after,
.sm-menu:after,
.skg-contain:after,
.skc-contain:after,
.agent-ready:after,
.text-special:after,
.request-row:after,
.tri-row:after {display:block;content:'';clear:both}

/* Responsive Style */
@media screen and (min-width:992px) {
	.hidden-pc {display:none}
	.request-col {float:right;width:48%}
	.request-col:first-child {float:left}
}

@media screen and (max-width:991px) {
	.hidden-sm {display:none}
	.ts48 {font-size:32px}
	.ts40 {font-size:28px}
	.ts32 {font-size:24px}
	.tri-row {padding-bottom:64px}
	.tri-col:nth-child(1),
	.tri-col:nth-child(2),
	.tri-col:nth-child(3) {text-align:center}
	.tri-col {float:left;width:100%;padding:0px}
	.skg-contain .skg-imgs {width:50%}
	.skc-contain .skc-imgs {width:33.33%}
	.contact-ft .sns {padding:0}
	.agent-imgs,
	.agent-form {width:100%}
	.request-form {padding:24px 32px}
	button {height:48px;line-height:32px;font-size:20px;width:100%;padding:0}
}


/* Mstyle Mod */
.ns-only {display:none;opacity:0;width:0;height:0;overflow:hidden}
.w-100 {width:100% !important}
.text-left {text-align:left}
.text-center {text-align:center}
.text-right {text-align:right}
.scroller {
	scrollbar-color: #aaad #0801;
	scrollbar-width: thin;
}
.scroller::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}
.scroller::-webkit-scrollbar-track-piece  {
	background-color: #0801;
}
.scroller::-webkit-scrollbar-thumb,
.scroller::-webkit-scrollbar-thumb:vertical,
.scroller::-webkit-scrollbar-thumb:horizontal {
	height: 8px;
	background-color: #aaad;
}
.line-clamp {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;  
	overflow: hidden;
}
.line-clamp-1 { -webkit-line-clamp: 1;}
.line-clamp-2 { -webkit-line-clamp: 2;}
.line-clamp-3 { -webkit-line-clamp: 3;}
.line-clamp-4 { -webkit-line-clamp: 4;}
.line-clamp-5 { -webkit-line-clamp: 5;}