@charset "utf-8";

#conts {font-size:.9em; color:#333333; line-height:1.4;}

/************************************
	Heading Text
************************************/

.conts h4,
.conts h5,
.conts h6 {display:block; position:relative; margin-bottom:calc((20 / 30) * 1em); font-weight:800; line-height:1.4em;}
.conts h4 {font-size:calc((30 / 18) * 1em); color:#252525;}
.conts h5 {font-size:calc((28 / 18) * 1em); color:#3875cb; padding-left:calc((20 / 28) * 1em);}
.conts h6 {font-size:calc((26 / 18) * 1em); padding-left:calc((30 / 26) * 1em);}

.conts h4 + h4,
.conts h4 + h5,
.conts h4 + h6,
.conts h5 + h4,
.conts h5 + h5,
.conts h5 + h6,
.conts h6 + h4,
.conts h6 + h5,
.conts h6 + h6 {margin-top:0;}
.conts h4:first-of-type {margin-top:0;}
.conts :not(h4):not(h5):not(h6) ~ h4,
.conts :not(h4):not(h5):not(h6) ~ h5,
.conts :not(h4):not(h5):not(h6) ~ h6 {margin-top:1.5em;}


.mh4 {margin-left:0;}
.mh5 {margin-left:calc((20 / 18) * 1em);}
.mh6 {margin-left:calc((30 / 18) * 1em);}

@media all and (max-width:640px) {
	.conts h5,
	.conts h6 {padding-left:0;}
	.mh4, 
	.mh5,
	.mh6 {margin-left:0;}
}

/************************************
	Default Text
************************************/

.conts em,
.conts .red {color:#C23D37;}
.conts strong {font-weight:600;}
.conts p + p {margin-top:calc((25 / 18) * 1em);}
.conts a.link {color:#2D66CF; text-decoration:underline;}
.conts a.icon.link:after {content:""; display:inline-block; position:relative; margin-left:.3em; vertical-align:middle; width:calc((24 / 18) * 1em); height:calc((24 / 18) * 1em); background:url(../img/common/ico_link_arrow.svg) no-repeat 50% 50% / contain;}

.point:not([class*="btn"]) {color:#2D66CF;}
.em:not([class*="btn"]) {color:#C23D37;}

.tip {position:relative; padding-left:calc((30 / 18) * 1em); color:#666666; background:none !important; line-height:1.4em;}
.tip:before {content:""; display:block; position:absolute; left:0; top:.7em; width:calc((24 / 18) * 1em); height:calc((24 / 18) * 1em); background:url(../img/common/spr_tips.svg) no-repeat 0 50% / auto calc((24 / 18) * 1em); transform:translateY(-50%); -webkit-transform:translateY(-50%);}
.tip.point {color:#2D66CF;}
.tip.point:before {background-position-x:calc((24 / 18) * -1em);}
.tip.error {color:#C23D37;}
.tip.error:before {background-position-x:calc((48 / 18) * -1em);}

.ico-arrow {display:inline-block; vertical-align:middle; width:1em; height:1em; background:url(../img/common/ico_step_arrow.svg) no-repeat 50% 50% / auto calc((24 / 18) * 1em); text-indent:-999px; overflow:hidden; border-radius:100%; border-radius:100%; margin:0 calc((10 / 18) * 1em); margin-top:-1px;}

.bod_write .orange {display:block; position:relative; font-size:.9em; margin-bottom:0; padding-left:calc((30 / 18) * 1em); color:#C23D37; background:none !important; line-height:1.4em;}
.bod_write .orange:before {content:""; display:block; position:absolute; left:0; top:.7em; width:calc((24 / 18) * 1em); height:calc((24 / 18) * 1em); background:url(../img/common/spr_tips.svg) no-repeat left calc((48 / 18) * -1em) top 50% / auto calc((24 / 18) * 1em); transform:translateY(-50%); -webkit-transform:translateY(-50%);}
.bod_write * ~ .orange {margin-top:1em; margin-bottom:0;}

/************************************
	Box
************************************/

.box-default {border:1px solid #DADADA; border-radius:calc((20 / 18) * 1em); padding:calc((30 / 18) * 1em);}
.box-default.bak {background:#F9F9F9;}

.box-button {display:flex; flex-wrap:wrap; justify-content:center; align-items:center; padding:.5em 1em;}
.box-button .btn {margin:.5em;}
@media all and (max-width:580px) {
	.box-button .btn {flex-grow:1;}
}

.box-design {display:block; position:relative; padding-left:calc((150 / 18) * 1em); z-index:0; margin-bottom:2em;}
.box-design > * {border-radius:calc((30 / 18) * 1em);}
.box-design > .icon {position:absolute; top:0; left:0; bottom:0; width:calc((160 / 18) * 1em); padding:calc((40 / 18) * 1em) 0; z-index:-1; background:#eff4fb url(../img/common/bak_design_box.png) no-repeat bottom 0 left 50% / 100% auto; overflow:hidden;}
.box-design > .icon img {display:block; position:relative; margin:0 auto; max-width:calc((80 / 18) * 1em);}
.box-design > .desc {display:block; position:relative; border:1px solid #dadada; background:#fff; padding:calc((40 / 18) * 1em) calc((50 / 18) * 1em);}
.box-design h4,
.box-design h5,
.box-design h6 {font-size:calc((26 / 18) * 1em); color:#3875cb;}
.box-design h4:before,
.box-design h5:before,
.box-design h6:before {display:none;}
.box-design p {word-break:keep-all;}
.box-design *[class*="btnbox"] {padding-top:calc((30 / 18) * 1em); border-top:1px solid #dadada;}
@media all and (max-width:640px) {
	.box-design {padding-left:calc((90 / 18) * 1em);}
	.box-design > * {border-radius:calc((20 / 18) * 1em);}
	.box-design > .icon {width:calc((100 / 18) * 1em); padding:calc((30 / 18) * 1em) 0;}
	.box-design > .icon img {max-width:calc((50 / 18) * 1em);}
	.box-design > .desc {padding:calc((30 / 18) * 1em) calc((40 / 18) * 1em);}
}

.bod_guide {display:block; position:relative; min-height:9em; padding:calc((40 / 18) * 1em) calc((50 / 18) * 1em) calc((40 / 18) * 1em) calc(((150 + 50) / 18) * 1em); z-index:0; margin-bottom:2em;}
.bod_guide:before,
.bod_guide:after {content:""; display:block; position:absolute; border-radius:calc((30 / 18) * 1em); z-index:-1;}
.bod_guide:before {top:0; left:0; bottom:0; width:calc((160 / 18) * 1em); padding:calc((40 / 18) * 1em) 0; z-index:-2; background:url(../img/icon/icon01.png) no-repeat top calc((40 / 18) * 1em) left 50% / calc((80 / 18) * 1em) auto,#eff4fb url(../img/common/bak_design_box.png) no-repeat bottom 0 left 50% / 100% auto; overflow:hidden; z-index:-2;}
.bod_guide:after {top:0; bottom:0; right:0; left:calc(((150) / 18) * 1em); background:#fff; border:1px solid #DADADA;}
.bod_guide h4,
.bod_guide h5,
.bod_guide h6 {font-size:calc((26 / 18) * 1em); color:#3875cb;}
.bod_guide h4:before,
.bod_guide h5:before,
.bod_guide h6:before {display:none;}
.bod_guide .minGuide p.bold.blue {font-size:calc((26 / 18) * 1em); color:#3875cb; margin-bottom:.5em;}
@media all and (max-width:640px) {
	.bod_guide {padding:calc((30 / 18) * 1em) calc((40 / 18) * 1em) calc((30 / 18) * 1em) calc(((90 + 40) / 18) * 1em);}
	.bod_guide:before,
	.bod_guide:after {border-radius:calc((20 / 18) * 1em);}
	.bod_guide:before {width:calc((100 / 18) * 1em); background:url(../img/icon/icon01.png) no-repeat top calc((30 / 18) * 1em) left 50% / calc((50 / 18) * 1em) auto,#eff4fb url(../img/common/bak_design_box.png) no-repeat bottom 0 left 50% / 100% auto;}
	.bod_guide:after {left:calc(((90) / 18) * 1em);}
}


*[class*="btnbox"] {display:block; position:relative; margin-top:calc((20 / 18) * 1em);}
.btnboxL {text-align:left;}
.btnboxC {text-align:center;}
.btnboxR {text-align:right;}

.box-img {display:block; position:relative; border-radius:calc((20 / 18) * 1em); border:1px solid #dadada; padding:calc((30 / 18) * 1em);}
.box-img:after {content:""; display:block; clear:both;}
.box-img img {display:block; position:relative; max-width:100%; margin:0 auto;}
.box-img .btn.wide {float:right; margin-top:1em;}

@media all and (max-width:640px) {
	.box-img {padding:calc((20 / 18) * 1em);}	
}

.box-prof-list {display:flex; flex-wrap:wrap; justify-content:center; position:relative; border-radius:calc((20 / 18) * 1em); border:1px solid #dadada; padding:calc((30 / 18) * 1em);}
.box-prof-list > div {display:block; position:relative; padding:calc(((10 / 2) / 18) * 1em); max-width:25%;}
.box-prof-list strong {display:block; position:relative; text-align:center; font-size:calc((20 / 18) * 1em); font-weight:800; margin-top:1em;}
@media all and (max-width:640px) {
	.box-prof-list {padding:calc((20 / 18) * 1em);}
	.box-prof-list > div {max-width:50%;}
}

.box-stepflow {overflow:hidden;}
.box-stepflow .stepflow {display:flex; margin:calc(((25 / 2) / 18) * -1em); flex-wrap:wrap;}
.box-stepflow .stepflow > li {display:flex; position:relative; padding:calc(((25 / 2) / 18) * 1em); width:calc(100% / 4); min-width:14em; flex-grow:1;}
.box-stepflow .stepflow > li:before {content:""; display:block; position:absolute; width:calc((35 / 18) * 1em); height:calc((35 / 18) * 1em); background:#F6F6F6 url(../img/common/ico_stepflow.svg) no-repeat 50% 50% / contain; top:50%; left:calc(((25 / 2) / 18) * -1em); transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); border:1px solid #D3D8DD; border-radius:calc((10 / 18) * 1em);}
.box-stepflow .stepflow .item {display:flex; flex-direction:column; flex-grow:1; border:1px solid #ddd; border-radius:calc((20 / 18) * 1em); padding:calc((30 / 18) * 1em) calc((20 / 18) * 1em); text-align:center;}
.box-stepflow .stepflow .item .tit {margin-bottom:calc((10 / 18) * 1em);}
.box-stepflow .stepflow .item .tit span {font-size:calc((22 / 18) * 1em); font-weight:700; color:#3875CB; line-height:1.3em;}
.box-stepflow .stepflow .item .con {word-break:keep-all;}

.box-stepflow .stepflow.no-arrow > li:before {display:none;}
.box-stepflow .stepflow .item .con .side {font-size:.9em; padding-top:1em; margin-top:1em; border-top:1px solid #ddd;}
.box-stepflow .stepflow .item .con .side strong {margin-right:.4em;}

@media all and (max-width:480px) {
	.box-stepflow .stepflow > li {width:100%; min-width:0;}
	.box-stepflow .stepflow > li:before {top:calc(((25 / 2) / 18) * -1em); left:50%; transform:translate(-50%,-50%) rotate(90deg); -webkit-transform:translate(-50%,-50%) rotate(90deg);}	
}

.stepflow-result {display:block; position:relative; padding:2em 1em; margin-top:2em; text-align:center; border-top:1px dashed #dadada; border-bottom:1px solid #dadada;}
.stepflow-result:before {content:""; display:block; position:absolute; width:calc((35 / 18) * 1em); height:calc((35 / 18) * 1em); background:#F6F6F6 url(../img/common/ico_stepflow.svg) no-repeat 50% 50% / contain; top:0; left:50%; transform:translate(-50%,-50%) rotate(90deg); -webkit-transform:translate(-50%,-50%) rotate(90deg); border:1px solid #D3D8DD; border-radius:calc((10 / 18) * 1em);}
.stepflow-result p {font-size:1.3em; font-weight:700;}


/************************************
	UL / OL List
************************************/

.list-ol li,
.list-ul li {display:block; position:relative; line-height:1.5em;}
.list-ol li + li,
.list-ul li + li {margin-top:calc((7 / 18) * 1em);}
.list-ol ul,
.list-ol ol,
.list-ul ul,
.list-ul ol {margin-top:calc((10 / 18) * 1em);}
*[class*="list-"]:not(.list-gellery-box) li li li {color:#555;}
.list-ul > li:before,
*[class*="list-"]:not(.list-gellery-box) ul > li:before {content:""; display:block; position:absolute; top:.75em; left:0; margin-top:-.5em; width:1em; height:1em; background:url(../img/common/bul_li.svg) no-repeat 0 0 / calc((10 / 18) * 1em) auto;}
.list-ul > li {padding-left:calc((15 / 18) * 1em);}
.list-ul > li:before {background-position-y:0;}
*[class*="list-"]:not(.list-gellery-box) > li ul > li {padding-left:calc((12 / 18) * 1em);}
*[class*="list-"]:not(.list-gellery-box) > li ul > li:before {background-position-y:-1em;}
*[class*="list-"]:not(.list-gellery-box) > li li ul > li {padding-left:calc((12 / 18) * 1em);}
*[class*="list-"]:not(.list-gellery-box) > li li ul > li:before {background-position-y:-2em;}
.list-ol li {padding-left:calc((28 / 18) * 1em);}
.list-ol li .num {display:block; position:absolute; top:0; left:0; font-size:calc((16 / 18) * 1em); color:#3875CB; font-weight:900;}
*[class*="list-"]:not(.list-gellery-box) > li ol > li {padding-left:calc((26 / 18) * 1em); margin-left:calc(((26 - 15) / 18) * -1em);}
*[class*="list-"]:not(.list-gellery-box) > li ol > li .num {display:flex; position:absolute; left:0; top:1.2em; align-items:center; justify-content:center; border-radius:9em; font-size:calc((11 / 18) * 1em); color:#fff; font-weight:400; background:#3875CB; width:calc((18 / 11) * 1em); height:calc((18 / 11) * 1em); transform:translateY(-50%); -webkit-transform:translateY(-50%);}
*[class*="list-"]:not(.list-gellery-box) > li li ol > li {margin-left:calc(((26 - 14) / 18) * -1em);}
*[class*="list-"]:not(.list-gellery-box) > li li ol > li .num {width:auto; height:auto; border-radius:0; text-align:left; font-size:1em; line-height:inherit; color:#888; font-weight:600; background:transparent; top:0; left:0; transform:none; -webkit-transform:none;}


/************************************
	Table
************************************/

.tbl {width:100%; table-layout:auto; border:0px solid #111; border-bottom-width:1px; border-top-width:2px;}
.tbl th,
.tbl td {height:calc((50 / 18) * 1em); box-sizing:border-box; padding:calc((15 / 18) * 1em) .5em; border:0px solid #DDDDDD; vertical-align:middle; font-size:1em; word-break:break-word;}
.tbl th {color:#111;}
.tbl td {word-break:keep-all;}
.tbl thead + tbody  {border-top:1px solid #ddd;}
.tbl thead th {background:#EFF4FB; font-weight:700;}
.tbl tbody th {background:#FCFCFC; font-weight:400;}
.tbl tr > * + * {border-left-width:1px;}
.tbl tr + tr {border-top:1px solid #ddd;}

.tbl thead tr .bo-point {border-left:3px solid #E73656; border-right:3px solid #E73656;}
.tbl thead tr:first-child .bo-point {border-top:3px solid #E73656;}
.tbl tbody tr .bo-point {border-left:3px solid #E73656; border-right:3px solid #E73656;}
.tbl tbody tr:first-child .bo-point {border-top:3px solid #E73656;}
.tbl tbody tr:last-child .bo-point {border-bottom:3px solid #E73656;}
.tbl thead + tbody tr:first-child .bo-point {border-top:1px solid #D0D0DD;}

.tbl-legend {display:block; position:relative; margin:0 !important; font-size:.95em; text-align:right; margin-bottom:.7em !important; flex:auto;}
.tbl-respon {position:relative;}
.tbl-respon > .guide {display:none; position:relative; padding-left:calc((30 / 18) * 1em); color:#666666; background:none !important; line-height:1.4em; margin-bottom:.5em;}
.tbl-respon > .guide:before {content:""; display:block; position:absolute; left:0; top:.7em; width:calc((24 / 18) * 1em); height:calc((24 / 18) * 1em); background:url(../img/common/ico_table_guide.svg) no-repeat 50% 50% / contain; transform:translateY(-50%); -webkit-transform:translateY(-50%);}

.tbl-respon.tbl-all-scroll {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center;}
.tbl-respon.tbl-all-scroll > .guide {display:block;}
.tbl-respon.tbl-all-scroll .tbl-box {width:100%; overflow:auto;}
.tbl-respon.tbl-all-scroll .tbl-box .tbl {width:109em;}

.tbl .bo-top {border-top-width:1px;}
.tbl .bo-left {border-left-width:1px;}
.tbl .bo-right {border-right-width:1px;}
.tbl .bo-bottom {border-bottom-width:1px;}

.tbl th span.sub {display:block; font-size:.9em; opacity:.8;}
.tbl th div.sub {text-align:left; padding:1em; background:#fff; border-radius:10px; border:1px solid #dadada;}
.tbl th div.sub > p {display:inline-block; margin:2px 10px; font-size:.9em;}
.tbl th div.sub > p strong {margin-right:.4em;}
.tbl th div.sub > p span {opacity:.8;}
.tbl td p.sub {font-size:.9em; color:#C23D37;}
.tbl td span.s {font-size:.9em; opacity:.8;}

.tbl td .tip {padding-left:0; margin:.3em 0;}
.tbl td .tip:before {display:inline-block; position:relative; vertical-align:middle; top:auto; transform:none; -webkit-transform:none; margin-right:.2em; margin-top:-.2em;}


@media all and (max-width:1000px) {
	.tbl-respon {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center;}
	.tbl-respon > .guide {display:block;}
	.tbl-respon .tbl-box {width:100%; overflow:auto;}
	.tbl-respon .tbl-box .tbl {width:56em;}
}


/************************************
	Button
************************************/

.btn {display:inline-block; vertical-align:middle; border:1px solid #111111; background:#111111; border-radius:10px; line-height:calc(1.5em - 2px); padding:calc((10 / 18) * 1em) calc((20 / 18) * 1em); color:#fff; font-weight:400; text-decoration:none;}
.btn:hover,
.btn:focus {background:#000; border-color:#000; color:#fff;}
.btn.line {background-color:#fff !important; color:#111111;}
.btn.line:hover,
.btn.line:focus {background-color:#111 !important; color:#fff;}
.btn.normal {background-color:#3875CB; border-color:#3875CB;}
.btn.normal:hover,
.btn.normal:focus {background-color:#2964B7; border-color:#2964B7;}
.btn.normal.line {color:#3875CB;}
.btn.normal.line:hover,
.btn.normal.line:focus {background-color:#3875CB !important; color:#fff;}
.btn.point {background-color:#E56744; border-color:#E56744;}
.btn.point:hover,
.btn.point:focus {background-color:#DD5934; border-color:#DD5934;}
.btn.point.line {color:#E56744;}
.btn.point.line:hover,
.btn.point.line:focus {background-color:#E56744 !important; color:#fff;}
.btn.del {background-color:#E56744; border-color:#E56744;}
.btn.del:hover,
.btn.del:focus {background-color:#DD5934; border-color:#DD5934;}
.btn.del.line {color:#E56744;}
.btn.del.line:hover,
.btn.del.line:focus {background-color:#E56744 !important; color:#fff;}
.btn.cancel {border-color:#bbb; color:#555555; background-color:#fff;}
.btn.cancel:hover,
.btn.cancel:focus {border-color:#555; color:#fff; background-color:#555 !important;}
.btn.disabled,
.btn[disabled] {pointer-events:none; cursor:default; border-color:#bbb !important; background-color:#eee !important; color:#555 !important;}

/* Size */

.btn.small {font-size:calc((16 / 18) * 1em); padding:calc((6.5 / 16) * 1em) calc((10 / 16) * 1em);}
.btn.small.icon {padding-left:calc((37 / 16) * 1em); background-size:calc((25 / 16) * 1em) auto; background-position-x:calc((10 / 16) * 1em);}

.btn.xsmall {font-size:calc((14 / 18) * 1em); padding:calc((5 / 14) * 1em) calc((8 / 14) * 1em); border-radius:8px;}
.btn.xsmall.icon {padding-left:calc((30 / 14) * 1em); background-size:calc((20 / 14) * 1em) auto; background-position-x:calc((8 / 14) * 1em);}


/* Color : White */

.btn.icon {padding-left:calc((50 / 18) * 1em); background-repeat:no-repeat; background-position:top 50% left calc((20 / 18) * 1em); background-size:calc((25 / 18) * 1em) auto;}
.btn.icon.down {background-image:url(../img/button/white/down.svg);}
.btn.icon.view {background-image:url(../img/button/white/view.svg);}
.btn.icon.go {background-image:url(../img/button/white/go.svg);}
.btn.icon.blank {background-image:url(../img/button/white/blank.svg);}
.btn.icon.list {background-image:url(../img/button/white/list.svg);}
.btn.icon.apply {background-image:url(../img/button/white/apply.svg);}
.btn.icon.write {background-image:url(../img/button/white/write.svg);}
.btn.icon.mod {background-image:url(../img/button/white/modify.svg);}
.btn.icon.top {background-image:url(../img/button/white/top.svg);}
.btn.icon.wide {background-image:url(../img/button/white/big.svg);}

.btn.line.icon.down:hover,
.btn.line.icon.down:focus {background-image:url(../img/button/white/down.svg) !important;}
.btn.line.icon.view:hover,
.btn.line.icon.view:focus {background-image:url(../img/button/white/view.svg) !important;}
.btn.line.icon.go:hover,
.btn.line.icon.go:focus {background-image:url(../img/button/white/go.svg) !important;}
.btn.line.icon.blank:hover,
.btn.line.icon.blank:focus {background-image:url(../img/button/white/blank.svg) !important;}
.btn.line.icon.list:hover,
.btn.line.icon.list:focus {background-image:url(../img/button/white/list.svg) !important;}
.btn.line.icon.apply:hover,
.btn.line.icon.apply:focus {background-image:url(../img/button/white/apply.svg) !important;}
.btn.line.icon.write:hover,
.btn.line.icon.write:focus {background-image:url(../img/button/white/write.svg) !important;}
.btn.line.icon.mod:hover,
.btn.line.icon.mod:focus {background-image:url(../img/button/white/modify.svg) !important;}
.btn.line.icon.top:hover,
.btn.line.icon.top:focus {background-image:url(../img/button/white/top.svg) !important;}
.btn.line.icon.wide:hover,
.btn.line.icon.wide:focus {background-image:url(../img/button/white/big.svg) !important;}

/* Color : Black */

.btn.line.icon.down {background-image:url(../img/button/black/down.svg);}
.btn.line.icon.view {background-image:url(../img/button/black/view.svg);}
.btn.line.icon.go {background-image:url(../img/button/black/go.svg);}
.btn.line.icon.blank {background-image:url(../img/button/black/blank.svg);}
.btn.line.icon.list {background-image:url(../img/button/black/list.svg);}
.btn.line.icon.apply {background-image:url(../img/button/black/apply.svg);}
.btn.line.icon.write {background-image:url(../img/button/black/write.svg);}
.btn.line.icon.mod {background-image:url(../img/button/black/modify.svg);}
.btn.line.icon.top {background-image:url(../img/button/black/top.svg);}
.btn.line.icon.wide {background-image:url(../img/button/black/big.svg);}


/* Color : Blue */

.btn.line.normal.icon.down {background-image:url(../img/button/blue/down.svg);}
.btn.line.normal.icon.view {background-image:url(../img/button/blue/view.svg);}
.btn.line.normal.icon.go {background-image:url(../img/button/blue/go.svg);}
.btn.line.normal.icon.blank {background-image:url(../img/button/blue/blank.svg);}
.btn.line.normal.icon.list {background-image:url(../img/button/blue/list.svg);}
.btn.line.normal.icon.apply {background-image:url(../img/button/blue/apply.svg);}
.btn.line.normal.icon.write {background-image:url(../img/button/blue/write.svg);}
.btn.line.normal.icon.mod {background-image:url(../img/button/blue/modify.svg);}
.btn.line.normal.icon.top {background-image:url(../img/button/blue/top.svg);}
.btn.line.normal.icon.wide {background-image:url(../img/button/blue/big.svg);}

/* Color : Gray */

.btn.cancel.icon.down {background-image:url(../img/button/gray/down.svg);}
.btn.cancel.icon.view {background-image:url(../img/button/gray/view.svg);}
.btn.cancel.icon.go {background-image:url(../img/button/gray/go.svg);}
.btn.cancel.icon.blank {background-image:url(../img/button/gray/blank.svg);}
.btn.cancel.icon.list {background-image:url(../img/button/gray/list.svg);}
.btn.cancel.icon.apply {background-image:url(../img/button/gray/apply.svg);}
.btn.cancel.icon.write {background-image:url(../img/button/gray/write.svg);}
.btn.cancel.icon.mod {background-image:url(../img/button/gray/modify.svg);}
.btn.cancel.icon.top {background-image:url(../img/button/gray/top.svg);}
.btn.cancel.icon.wide {background-image:url(../img/button/gray/big.svg);}

/* Color : Orange */

.btn.line.point.icon.down {background-image:url(../img/button/orange/down.svg);}
.btn.line.point.icon.view {background-image:url(../img/button/orange/view.svg);}
.btn.line.point.icon.go {background-image:url(../img/button/orange/go.svg);}
.btn.line.point.icon.blank {background-image:url(../img/button/orange/blank.svg);}
.btn.line.point.icon.list {background-image:url(../img/button/orange/list.svg);}
.btn.line.point.icon.apply {background-image:url(../img/button/orange/apply.svg);}
.btn.line.point.icon.write {background-image:url(../img/button/orange/write.svg);}
.btn.line.point.icon.mod {background-image:url(../img/button/orange/modify.svg);}
.btn.line.point.icon.top {background-image:url(../img/button/orange/top.svg);}
.btn.line.point.icon.wide {background-image:url(../img/button/orange/big.svg);}

.btn.line.del.icon.down {background-image:url(../img/button/orange/down.svg);}
.btn.line.del.icon.view {background-image:url(../img/button/orange/view.svg);}
.btn.line.del.icon.go {background-image:url(../img/button/orange/go.svg);}
.btn.line.del.icon.blank {background-image:url(../img/button/orange/blank.svg);}
.btn.line.del.icon.list {background-image:url(../img/button/orange/list.svg);}
.btn.line.del.icon.apply {background-image:url(../img/button/orange/apply.svg);}
.btn.line.del.icon.write {background-image:url(../img/button/orange/write.svg);}
.btn.line.del.icon.mod {background-image:url(../img/button/orange/modify.svg);}
.btn.line.del.icon.top {background-image:url(../img/button/orange/top.svg);}
.btn.line.del.icon.wide {background-image:url(../img/button/orange/big.svg);}

/* Color : disabled */

.btn.disable.icon.down,
.btn[disabled].icon.down {background-image:url(../img/button/gray/down.svg) !important;}
.btn.disable.icon.view,
.btn[disabled].icon.view {background-image:url(../img/button/gray/view.svg) !important;}
.btn.disable.icon.go,
.btn[disabled].icon.go {background-image:url(../img/button/gray/go.svg) !important;}
.btn.disable.icon.blank,
.btn[disabled].icon.blank {background-image:url(../img/button/gray/blank.svg) !important;}
.btn.disable.icon.list,
.btn[disabled].icon.list {background-image:url(../img/button/gray/list.svg) !important;}
.btn.disable.icon.apply,
.btn[disabled].icon.apply {background-image:url(../img/button/gray/apply.svg) !important;}
.btn.disable.icon.write,
.btn[disabled].icon.write {background-image:url(../img/button/gray/write.svg) !important;}
.btn.disable.icon.mod,
.btn[disabled].icon.mod {background-image:url(../img/button/gray/modify.svg) !important;}
.btn.disable.icon.top,
.btn[disabled].icon.top {background-image:url(../img/button/gray/top.svg) !important;}
.btn.disable.icon.wide,
.btn[disabled].icon.wide {background-image:url(../img/button/gray/big.svg) !important;}

/* Layout */

*[class *= "btnbox"] .btn {margin:.1em;}
@media all and (max-width:470px) {
	*[class *= "btnbox"] .btn {margin:.2em 0; width:100%; text-align:center;}
}


/************************************
	Common
************************************/

.dl-wrap {margin-top:1.666667em; border-top:2px solid #111;}
.dl-wrap > dl {display:flex; flex-wrap:nowrap; align-items:center; flex-grow:1; border-bottom:1px solid #D8D8D8; padding:1.111112em 0;}
.dl-wrap > dl > * {display:block; position:relative; padding:0 .5em; flex-grow:1;}
.dl-wrap > dl dt {width:8em; font-weight:700; flex-grow:0; flex-shrink:0; text-align:left !important;}
.dl-wrap > dl:last-child {border-color:#111;}

@media all and (max-width:1024px) {
	.intro {flex-wrap:wrap; flex-direction:column; align-items:center;}
	.intro .img-wrap {max-width:80%;}
	.intro .txt-wrap {width:100%; margin-top:2em;}	
}
@media all and (max-width:640px) {
	.dl-wrap > dl {width:100%;}
	.dl-wrap > dl dt {width:6em;}
}

/* 상징물 */
.box-img.box-symbol {background:url('../img/content/01/bg_symbol.svg') repeat;}

/* 양측정렬 */
.box-twoside {display:flex; flex-wrap:wrap; justify-content:space-between;}
.box-twoside:first-child {margin-top:0 !important;}
.box-twoside > div {width:48.5%;}

@media all and (max-width:768px) {
	.box-twoside {display:block; margin:0;}
	.box-twoside > div {width:auto; padding:0;}
	.box-twoside > div + div {margin-top:2em;}
}


/************************************
	Map
************************************/

.map-guide {display:block; position:relative; margin-bottom:6em;}
.map-guide .skip {position:absolute; top:1em; right:1em; z-index:2; opacity:0; width:0px; height:0px; overflow:hidden;}
.map-guide .skip:focus {opacity:1; width:auto; height:auto;}
.map-guide .mapArea {display:block; position:relative; height:calc((500 / 18) * 1em); border-radius:calc((30 / 18) * 1em); overflow:hidden; border:1px solid #dadada; z-index:0;}
.map-guide .mapArea .wrap_map {height:500px !important;}
.map-guide .mapArea .cont,
.map-guide .mapArea .map_border {display:none !important;}
.map-guide .mapArea .root_daum_roughmap {display:block; position:relative; width:100% !important; height:100%;}

.map-guide .info {display:flex; justify-content:end; position:absolute; left:0; right:0; top:100%; transform:translateY(-50%); -webkit-transform:translateY(-50%);}
.map-guide .info > div {display:flex; align-items:center; font-size:calc((20 / 18) * 1em); padding:1.5em 2em 1.5em 3em; background:rgba(255,255,255,.5); border:1px solid #fff; border-radius:1.5em 0 1.5em 1.5em; box-shadow:0 .5em 1.5em .5em rgba(0,0,0,.05); backdrop-filter:blur(5px);}
.map-guide .info > div > * + * {margin-left:2.5em; margin-top:0;}
.map-guide .info h4 {font-size:1.2em; margin:0; color:#3875cb;}
.map-guide .info p {display:flex; align-items:center;}
.map-guide .info p:before {content:""; display:block; position:relative; width:1.6em; height:1.6em; background:no-repeat 50% 50% / contain;}
.map-guide .info p.address:before {background-image:url(../img/common/ico_map_address.svg);}
.map-guide .info p.tel:before {background-image:url(../img/common/ico_map_tel.svg);}
.map-guide .info p > * {display:block; font-size:.9em;}
.map-guide .info p strong {font-family:'Poppins'; font-weight:800; margin:0 calc((10 / 18) * 1em); color:#3875cb;}

@media all and (max-width:1024px) {
	.map-guide {margin-bottom:2em;}
	.map-guide .mapArea {height:calc((400 / 18) * 1em);}
	.map-guide .info {position:relative; transform:none; -webkit-transform:none; margin-top:-4em; padding-left:2em;}
	.map-guide .info > div {flex-direction:column; padding:1.5em;}
	.map-guide .info h4 {width:100%; margin-bottom:.5em;}
	.map-guide .info p {margin-left:0; width:100%;}
	.map-guide .info p + p {margin-top:.5em;}
	.map-guide .info p:before,
	.map-guide .info strong {flex-shrink:0;}	
}
@media all and (max-width:640px) {
	.map-guide .info {margin-top:1em; padding:0;}
	.map-guide .info > div {width:100%;}
	.map-guide .info p {flex-wrap:wrap;}
	.map-guide .info p span {width:100%; margin-left:2.3em;}
}


/************************************
	Scroll Bar
************************************/

.conts .scroll {width:100%; height:100%;}
.conts .scroll.scroll-wrapper {position:relative; height:100%; overflow:visible !important;}
.conts .scroll-element_outer,
.conts .scroll-element_outer .scroll-element_size,
.conts .scroll-element_track {width:100%; height:100%;}
.conts .scroll .scroll-element {background:#EBEBF5; border-radius:9em;}
.conts .scroll .scroll-element .scroll-bar {display:block; position:absolute; top:0; left:0; background:#17212D; border-radius:9em; opacity:1;}
.conts .scroll .scroll-element.scroll-x,
.conts .scroll .scroll-element.scroll-y {display:none; position:absolute;}
.conts .scroll .scroll-element.scroll-x.scroll-scrollx_visible,
.conts .scroll .scroll-element.scroll-y.scroll-scrolly_visible {display:block;}

.conts .scroll .scroll-element.scroll-x {left:0; bottom:-.6em; right:0; height:calc((6 / 18) * 1em);}
.conts .scroll .scroll-element.scroll-x .scroll-bar {bottom:0;}
.conts .scroll .scroll-element.scroll-y {top:0; bottom:0; right:-.6em; width:calc((6 / 18) * 1em);}
.conts .scroll .scroll-element.scroll-y .scroll-bar {right:0;}


/************************************
	본인인증
************************************/

.realnameWrap {opacity:0;}

.realNameWrap {display:block; position:relative; padding:1.112em 1.389em; background:#F8F8FC; overflow:hidden; opacity:0;}
.realNameWrap.complate {opacity:1;}
.realNameWrap .inner {display:block; position:relative;}
.realNameWrap .realNameGroup {display:flex; flex-wrap:wrap;}
.realNameWrap .realNameGroup > li {display:flex; position:relative; width:50%; padding:1.112em 1.389em; box-sizing:border-box; flex-grow:1;}
.realNameWrap .realNameGroup > li.login,
.realNameWrap .realNameGroup > li.onepass {display:none;}
.realNameWrap .item {display:flex; justify-content:center; flex-grow:1; position:relative; background:#fff; padding:2.223em 1.667em; text-align:center;}
.realNameWrap .item h4 {color:#347DDD; font-size:1.33em; padding-left:0;}
.realNameWrap .item h4:before {display:none;}
.realNameWrap .item p {word-break:keep-all; font-size:.944em; margin:0 !important;}
.realNameWrap .item .control {margin-top:1.667em;}
.realNameWrap .item .control .btn {max-width:100%;}
.realNameWrap .item .control .btn.digipass {padding-left:3.11112em; background:url(../img/board/ico_onepass.svg) no-repeat .833334em 50% #1C2674 !important; border-color:#1C2674 !important; color:#fff !important; background-size:auto 1.33334em;}

.realNameWrap .login {width:auto !important; float:none !important; clear:both;}
.realNameWrap .login .desc {height:auto !important;}
.realNameWrap .loginWrap .row {position:relative;}
.realNameWrap .loginWrap .row label {position:absolute; top:0; left:0; text-indent:-999px; overflow:hidden; opacity:0; z-index:-999;}
.realNameWrap .loginWrap .row input[type="text"],
.realNameWrap .loginWrap .row input[type="password"] {display:block; position:relative; width:100%; height:2.824em; margin-bottom:10px;}

.realNameWrap .realname .item:before {background-image:url(../img/board/ico_verify_identify.svg);}
.realNameWrap .i-pin .item:before {background-image:url(../img/board/ico_verify_ipin.svg);}
.realNameWrap .onepass .item:before {background-image:url(../img/board/ico_verify_onepass.svg);}
.realNameWrap .login .item:before {background-image:url(../img/board/ico_verify_login.svg);}

@media all and (min-width:861px) {
	.realNameWrap .login .item {padding-top:2.77778em; padding-bottom:2.77778em;}
	.realNameWrap .login .item:before {position:absolute; top:2.77778em; left:6.94445em;}
	.realNameWrap .login .item h4 {position:absolute; top:5.275em; left:.625em; width:11.6667em; text-align:center;}
	.realNameWrap .login .item .desc > div {display:block; position:absolute; text-align:left; top:2.7778em; right:2.7778em; width:18.333em; word-break:keep-all;}
	.realNameWrap .login .item .forget-link {position:absolute; right:2.7778em; bottom:2.7778em; width:18.333em; text-align:left;}
	.realNameWrap .login .item .forget-link p {color:#777777;}
	.realNameWrap .login .item .control {margin-top:.8889em;}
	.realNameWrap .login .loginWrap {display:block; position:relative; margin-left:13.61112em; margin-right:22.16667em; text-align:left;}

	.realNameWrap .loginWrap .keypad_box {position:absolute; bottom:.7em; right:0;}
}
@media all and (max-width:1510px) and (min-width:861px) {
	.realNameWrap .login .loginWrap {margin-left:10.61112em; margin-right:22em;}
	.realNameWrap .login .item:before {left:5em;}
	.realNameWrap .login .item h4 {width:8.6667em;}
}
@media all and (max-width:1000px) and (min-width:861px) {
	.realNameWrap .login .loginWrap {margin-right:20em; margin-left:9.61112em;}
	.realNameWrap .login .item .desc > div,
	.realNameWrap .login .item .forget-link {right:1.7em; width:18em;}

	.realNameWrap .login .item:before {left:4em;}
	.realNameWrap .login .item h4 {width:7.2em;}
}
@media all and (max-width:940px) and (min-width:861px) {
	.realNameWrap .login .item:before {position:relative; margin:0 auto; top:auto; left:auto;}
	.realNameWrap .login .item h4 {position:relative; width:auto; top:auto; left:auto;}
	.realNameWrap .login .loginWrap {margin-left:0;}
	.realNameWrap .login .item .desc > div {top:9.2em;}
}
@media all and (max-width:1024px) {
	.realNameWrap,
	.realNameWrap .siteLogin,
	.realNameWrap .realNameGroup > li {padding:.8em;}
	.realNameWrap .item {padding:1.2em;}
}
@media all and (max-width:860px) {
	.realNameWrap .realNameGroup > li {width:auto; float:none;}
	.realNameWrap .realNameGroup .desc {height:auto !important;}
	.realNameWrap .login .loginWrap,
	.realNameWrap .login .item .forget-link {margin-top:1.5em;}
	.realNameWrap .login .loginWrap {max-width:340px; margin-left:auto; margin-right:auto;}
}


/********************
	Sitemap
********************/

.sitemapArea {display:flex; flex-direction:row; flex-wrap:nowrap; word-break:keep-all; padding:1.75em 1.2em 1.75em;}
.sitemapArea + .sitemapArea {border-top:1px dashed #e9e9e9;}
.sitemapLeft {width:25%;}
.sitemapLeft > h4 {font-size:1.777777em;}
.sitemapRight {width:75%;}
.sitemapRight > ul {display:flex; flex-wrap:wrap; justify-content:flex-start;}
.sitemapRight > ul > li {width:25%; padding:.5em; margin-top:0;}
.sitemapRight > ul > li:before {display:none;}
.sitemapRight > ul > li > a {display:block; padding:.66666em .777777em; border:1px solid #DADADA; border-radius:.75em; text-align:center;}
.sitemapRight > ul > li > div {background:#F8F9FD; padding:1.25em; margin-top:.5em;}
.sitemapRight > ul > li > div > ul li {width:100%;}
.sitemapRight > ul > li > div > ul li + li {margin-top: .25em;}
.sitemapRight > ul > li > div > ul li a {position:relative; display:block; padding:0 .75em 0 .5em; color:#555; font-size:.95em;}
.sitemapRight > ul > li >  div > ul li a:before {content:''; display:block; width:.234em; height:.234em; position:absolute; top:.6em;; left:0; background:#999;}
.sitemapRight > ul > li > a:hover {background:#333; border-color:#333; color:#fff;}
.sitemapRight > ul > li > div > ul li a:hover {text-decoration:underline;}

@media all and (max-width:1024px) {
	.sitemapArea {flex-direction:column; padding:1.75em 0;}
	.sitemapLeft,
	.sitemapRight {width:100%;}
}


@media all and (max-width:640px) {
	.sitemapRight > ul > li {width:50%;}
}

/********************
	Printpage
********************/

@media print {
	.tbl-respon {display:block;}
	.tbl-respon > .guide {display:none;}
	.tbl-respon .tbl-box {overflow:visible;}
	.tbl-respon .tbl-box .tbl {width:100%;}
}