html, body { background-color: #fff!important; }
section.pdt-s { line-height: 1.4; /*text-align: center;*/ margin-bottom: 150px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; }
section.pdt-s { padding: 0 30px; }
section.pdt-s .title { font-size: 30px; font-weight: normal; line-height: 1.33; letter-spacing: normal; margin-top: 0; margin-bottom: 23px; color: #2e3034; }
section.pdt-s .sub-title { font-size: 14px; font-weight: 300; line-height: 1.43; letter-spacing: normal; margin-bottom: 0; color: #878791; }

section.pdt-s.sample { margin-top: 92px; margin-bottom: 90px; background: none; }
section.pdt-s.sample ul { margin: 50px auto 60px; display: flex; width: 100%; }
section.pdt-s.sample ul li { width: 33.33%; padding: 16px 0; font-size: 16px; font-weight: 300; line-height: 1.8; color: #62656a; border-bottom: 3px solid transparent; cursor: pointer; }
section.pdt-s.sample ul li.active { color: #4789e7; border-bottom-color: #4789e7; }
section.pdt-s.sample .pdt-list { margin-left: -15px; margin-right: -15px; }
section.pdt-s.sample .pdt-list .item { padding: 20px 15px; }
section.pdt-s.sample .pdt-list .item .imgbox { position: relative; }
section.pdt-s.sample .pdt-list .item .imgbox img { border: 1px solid #e7e7e7; margin: auto; }
section.pdt-s.sample .pdt-list .item .imgbox .overbox { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; }
section.pdt-s.sample .pdt-list .item.guide { display: none; }
section.pdt-s.sample .btn-wrap .loading-status { padding: 0px 30px 60px 0; }
section.pdt-s.sample .btn-wrap .btn { display: inline-block; width: 148px; margin-top: 50px; margin-bottom: 20px; padding: 20px 5px; font-size: 13px; font-weight: 300; line-height: 1; color: #46505d; border: 1px solid #46505d; -webkit-border-radius: 0; border-radius: 0; }

section.pdt-s.cts .pdt-card { margin: 70px auto 0; display: flex; flex-direction: column; width: 265px; }
section.pdt-s.cts .pdt-card li { padding: 55px 15px 47px; border: 1px solid #dfe1e3; background-color: #fff; -webkit-border-radius: 20px; border-radius: 20px; vertical-align: center; }
section.pdt-s.cts .pdt-card li + li { margin-top: 30px; }
section.pdt-s.cts .pdt-card .icon { position: relative; display: inline-block; width: 70px; height: 70px; background-color: #4789e7; -webkit-border-radius: 50%; border-radius: 50%; }
section.pdt-s.cts .pdt-card svg { fill: #fff; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
section.pdt-s.cts .pdt-card h3 { margin-top: 28px; margin-bottom: 10px; font-size: 22px; font-weight: normal; color: #2e3034; }
section.pdt-s.cts .pdt-card p { margin-bottom: 0; font-size: 14px; font-weight: 300; color: #8e9095; }

section.pdt-s.contact {}
section.pdt-s.contact .pdt-card { margin: 100px 0; display: grid; justify-content: center; align-items: center; }
section.pdt-s.contact .pdt-list { margin: 58px 0 0; display: grid; grid-template-columns: repeat(2, calc(50% - 15px)); gap: 25px 30px; }
section.pdt-s.contact .input-group.span-2,
section.pdt-s.contact .kcaptcha-group { grid-column: span 2; position: relative; }
section.pdt-s.contact .input-group > * { display: block; width: 100%; font-size: 16px; font-weight: 300; text-align: left; }
section.pdt-s.contact .input-group label { color: #222428; margin-bottom: 8px; }
section.pdt-s.contact .input-group.optional label:after { content: '*'; position: relative; margin-left: 3px; display: inline-block; color: #ff0000; }
section.pdt-s.contact .input-group .input-control,
section.pdt-s.contact .kcaptcha-key-wrap input { color: #2e3034; border: 1px solid #e5e8eb; line-height: 1.8; }
section.pdt-s.contact .input-group .input-control:focus,
section.pdt-s.contact .kcaptcha-key-wrap input:focus { border-color: #4789e7; }
section.pdt-s.contact .input-group input,
section.pdt-s.contact .kcaptcha-key-wrap input { padding: 5px 10px; background-color: #fff; }
section.pdt-s.contact .input-group input:autofill { background-color: transparent; }
section.pdt-s.contact .input-group input:-webkit-autofill { background-color: transparent; }
section.pdt-s.contact .input-group textarea { padding: 10px 10px 30px; resize: none; height: 200px; }
section.pdt-s.contact .input-group .write-loader { position: absolute; bottom: 23px; right: 27px; display: inline-block; white-space: nowrap; font-size: 14px; font-weight: 300; color: #222428; text-align: right; pointer-events: none; }
section.pdt-s.contact .input-group textarea.input-control + .input-error + .write-loader { position: absolute; bottom: 11px; right: 15px; }
section.pdt-s.contact .input-group .write-byte { font-weight: normal; }
section.pdt-s.contact .kcaptcha-group { display: flex; flex-direction: row; }
section.pdt-s.contact .kcaptcha-box { width: 186px; }
section.pdt-s.contact .kcaptcha-box p { width: 100%; margin-bottom: 0; }
section.pdt-s.contact .kcaptcha-box p img { width: 100%; }
section.pdt-s.contact .kcaptcha-key-wrap { padding-left: 30px; }
section.pdt-s.contact .kcaptcha-key-wrap input { display: block; width: 234px; max-width: 100%; font-size: 15px; font-weight: 300; }
section.pdt-s.contact .kcaptcha-key-wrap input::-webkit-input-placeholder { color: #909090; } 
section.pdt-s.contact .kcaptcha-key-wrap input:-moz-placeholder { color: #909090; }
section.pdt-s.contact .kcaptcha-key-wrap a.small { display: inline-block; margin-top: 14px; font-size: 14px; font-weight: 100; line-height: 1.4; letter-spacing: -0.35px; color: #797979; }
section.pdt-s.contact .kcaptcha-key-wrap a.small svg { display: inline-block; margin-right: 10px; margin-bottom: -5px; fill: #a5a5a5; }

section.pdt-s.contact .input-error { padding: 6px 10px 0; font-size: 12px; color: #ee445f; }
section.pdt-s.contact .input-error i { vertical-align: middle; line-height: 1.1; }

section.pdt-s.contact .btn-wrap { margin-top: 48px; text-align: center; }
section.pdt-s.contact .btn-wrap .btn { display: inline-block; width: 162px; padding: 10px; font-size: 16px; font-weight: 300; line-height: 1.5; color: #fff; background-color: #4789e7; -webkit-border-radius: 50px; border-radius: 50px; }

#template-site .modal-dialog .modal-content { max-width: 100%; }
.pdt-goto-btn { position: fixed; bottom: 15px; right: 30px; cursor: pointer; border-bottom: 1px solid #000; background-color: rgba(255,255,255,0.4); }

@media only screen and (min-width: 767px) {
	section.pdt-s.sample ul { width: 456px; }
	section.pdt-s.sample ul li { width: 152px; }

	section.pdt-s.contact .pdt-card { grid-template-columns: 1fr auto; }
	section.pdt-s.contact .pdt-card .text { padding-left: 54px; }
	section.pdt-s.contact .pdt-card .img { padding-right: 55px; }

	section.pdt-s.cts .pdt-card { width: auto; flex-direction: row; justify-content: center; }
	section.pdt-s.cts .pdt-card li { width: 265px; margin-left: 15px; margin-right: 15px; }
	section.pdt-s.cts .pdt-card li + li { margin-top: 0; }
	.pdt-goto-btn { right: 50px; }
}
@media only screen and (min-width: 991px) {
	section.pdt-s.sample { margin-top: 95px; }
	section.pdt-s.sample ul { margin: 50px auto 50px; width: 498px; }
	section.pdt-s.sample ul li { padding: 18px 5px; width: 166px; font-size: 22px; line-height: 1.5; }
	section.pdt-s.sample .btn-wrap .btn { padding: 19px 5px; font-size: 14px; }

	section.pdt-s.contact .kcaptcha-key-wrap input { width: 239px; }
	section.pdt-s.contact .btn-wrap .btn { width: 180px; padding: 11px 10px 12px; font-size: 18px; }
}
@media only screen and (min-width: 1199px) {
	section.pdt-s.contact { max-width: 1140px; margin-left: auto; margin-right: auto; }
	section.pdt-s.contact .pdt-card .text { padding-left: 70px; }
	section.pdt-s.contact .pdt-card .img { padding-right: 160px; }
	section.pdt-s.contact .kcaptcha-key-wrap input { width: 339px; }
}

@media only screen and (max-width: 768px) {
	section.pdt-s.contact .pdt-card { grid-template-columns: 1fr; grid-template-rows: auto auto; gap: 50px;  }
	section.pdt-s.contact .pdt-card .row { text-align: center; }
	section.pdt-s.contact .input-group { grid-column: span 2; }
}
@media only screen and (max-width: 480px) {
	section.pdt-s.contact .input-group .write-loader { bottom: 11px; right: 15px; }
	section.pdt-s.contact .kcaptcha-group { flex-direction: column; }
	section.pdt-s.contact .kcaptcha-key-wrap { padding: 25px 0 0; }
	section.pdt-s.contact .kcaptcha-key-wrap input { width: 100%; }
}