@charset "UTF-8";
/* prettier-ignore */
.smain1__head {
display: grid;
}
@media (min-width: 1200px) {
.smain1__head {
grid-template-columns: repeat(2, 1fr);
gap: 40px;
}
}
.smain1__c1 {
display: flex;
}
@media (max-width: 749px) {
.smain1__c1 {
margin: 0 auto;
flex-direction: row;
justify-content: center;
align-items: center;
}
}
.smain1__c1 .i {
width: 178px;
text-align: center;
}
@media (max-width: 749px) {
.smain1__c1 .i {
width: 80px;
margin-right: 15px;
}
}
.smain1__c1 .i img {
transform: translateY(-23px);
}
@media (max-width: 749px) {
.smain1__c1 .i img {
width: 100%;
}
}
.smain1__c1 p {
padding-top: 44px;
font-size: 36px;
font-family: GmarketSans;
color: #3c4552;
letter-spacing: -0.9px;
line-height: 1.13;
}
@media (max-width: 749px) {
.smain1__c1 p {
padding-top: 0;
font-size: 25px;
}
}
.smain1__c1 .t1 {
font-size: 36px;
font-weight: bold;
color: var(--mid-blue);
}
@media (max-width: 749px) {
.smain1__c1 .t1 {
font-size: 25px;
}
}
.smain1__c1 .t2 {
font-size: 60px;
font-weight: 500;
}
@media (max-width: 749px) {
.smain1__c1 .t2 {
font-size: 25px;
}
}
.smain1__c2 .tit {
margin-bottom: 23px;
font-family: GmarketSans;
font-size: 27px;
line-height: 1;
font-weight: 500;
color: #161616;
}
.smain1__c2 .b {
display: flex;
gap: 26px;
}
.smain1__c2 .b dl {
width: 193px;
min-height: 74px;
padding: 10px 18px;
padding-top: 14px;
border-radius: 5px;
box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.1);
background-color: #fff;
}
@media (max-width: 749px) {
.smain1__c2 .b dl {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: center;
align-items: center;
flex-direction: column;
text-align: center;
}
}
.smain1__c2 .b dt {
margin-bottom: 11px;
font-family: GmarketSans;
font-size: 18px;
font-weight: bold;
line-height: 1.33;
color: var(--teal);
}
.smain1__c2 .b dd {
margin-top: 11px;
font-family: GmarketSans;
font-size: 18px;
font-weight: 500;
line-height: 1.33;
color: #161616;
}
.smain1__c2 .b ul {
font-family: GmarketSans;
font-weight: 500;
line-height: 1.88;
color: #161616;
}
.smain1__c2 .b li {
padding-left: 9px;
position: relative;
}
.smain1__c2 .b li:before {
content: "";
position: absolute;
top: 6.5px;
transform: translateY(4px);
left: 0;
width: 3px;
height: 3px;
border-radius: 3px;
background-color: #161616;
}
.smain1__c2 .b em {
color: #e34679;
}
.smain1__mid {
display: grid;
gap: 15px;
margin-top: 20px;
}
@media (min-width: 1200px) {
.smain1__mid {
margin-top: 60px;
grid-template-columns: repeat(2, 1fr);
gap: 40px;
}
}
.smain1__box {
padding: 30px;
border-radius: 10px;
background-color: #edf7f4;
display: grid;
}
@media (max-width: 749px) {
.smain1__box {
padding: 18px;
grid-template-columns: 70px auto;
gap: 20px;
}
}
@media (min-width: 750px) {
.smain1__box {
grid-template-columns: 90px auto;
gap: 30px;
min-height: 200px;
}
}
.smain1__box .i {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
background-color: #fff;
width: 100%;
aspect-ratio: 1/1;
border-radius: 100%;
}
.smain1__box .i img {
vertical-align: top;
width: 40px;
}
.smain1__box .tit {
height: 22px;
margin-bottom: 15px;
font-family: GmarketSans;
font-size: 24px;
line-height: 1.25;
text-align: left;
color: var(--black);
font-weight: 500;
}
.smain1__box .tit em {
font-weight: bold;
}
.smain1__box p {
line-height: 1.5;
letter-spacing: -0.4px;
}
.smain1__box--blue {
background-color: #e2edfe;
}
.smain1__bottom {
display: grid;
gap: 15px;
}
@media (max-width: 749px) {
.smain1__bottom {
margin-top: 20px;
}
}
@media (min-width: 750px) {
.smain1__bottom {
margin: 30px -26px 0;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
}
}
@media (min-width: 1200px) {
.smain1__bottom {
margin: 60px -26px 0;
grid-template-columns: repeat(4, 1fr);
}
}
.smain1__service {
position: relative;
padding: 0 26px;
}
@media (min-width: 750px) {
.smain1__service + * {
border-left: 1px solid var(--bd-color);
}
}
@media (max-width: 1199px) {
.smain1__service:nth-child(3) {
border: none;
}
}
.smain1__service .tit {
margin-bottom: 11px;
font-family: GmarketSans;
font-size: 24px;
font-weight: 500;
text-align: left;
color: var(--black);
}
@media (max-width: 749px) {
.smain1__service .tit br {
display: none;
}
}
.smain1__service .tit em {
font-weight: bold;
}
.smain1__service p {
line-height: 1.5;
letter-spacing: -0.4px;
}
.smain1__service ul {
margin-top: 20px;
}
.smain1__service ul a {
display: block;
padding-left: 16px;
position: relative;
width: 202px;
font-family: GmarketSans;
font-weight: 500;
line-height: 1.88;
text-align: left;
color: var(--black);
}
.smain1__service ul a:before {
content: "";
position: absolute;
top: 6.5px;
transform: translateY(4px);
left: 0;
width: 3px;
height: 3px;
border-radius: 3px;
background-color: #333333;
}
.smain1__service .i {
position: absolute;
bottom: 0;
right: 26px;
width: 60px;
height: 60px;
border-radius: 60px;
background-color: #f3f3f3;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
@media (max-width: 749px) {
.smain1__service .i {
right: 0;
}
}

.header {
margin-bottom: 0;
}

#submain {
padding-top: 57px;
position: relative;
background: url(/static/portal/img/submain/s1-bg.png) center 0 no-repeat;
}

.submain1 {
background: url(/static/portal/img/submain/s1-bg.png) center 0 no-repeat;
}

.submain3::before,
.submain7::before,
.submain4::before {
position: absolute;
top: 0;
width: 100%;
height: 253px;
z-index: -1;
}

.submain-head {
position: relative;
height: 196px;
padding-left: 66px;
font-size: 40px;
font-weight: 500;
color: #3c4552;
}
.submain-head .tset {
text-align: center;
display: inline-block;
}
.submain-head .t1::before {
content: "";
}
.submain-head strong {
font-family: GmarketSans;
font-weight: bold;
color: var(--mid-blue);
}
.submain-head__deco {
position: absolute;
right: 54px;
bottom: -30px;
}
.submain3 .submain-head__deco {
right: 0;
bottom: -42px;
}

.submain-head2 {
font-family: GmarketSans;
font-size: 30px;
font-weight: 500;
line-height: 1.17;
letter-spacing: -1.2px;
color: #354352;
display: grid;
grid-template-columns: 130px auto;
gap: 20px;
align-items: center;
}
@media (min-width: 750px) {
.submain-head2 {
font-size: 38px;
}
}
@media (min-width: 1200px) {
.submain-head2 {
font-size: 48px;
}
}
@media (max-width: 749px) {
.submain-head2 {
display: flex;
justify-content: center;
padding: 0;
line-height: 1.2;
flex-direction: column;
align-items: center;
text-align: center;
}
}
@media (min-width: 1200px) {
.submain-head2 {
align-items: flex-start;
padding-left: 36px;
}
}
.submain-head2 strong {
font-weight: bold;
color: #0063c5;
}
.submain-head2 .i {
flex-shrink: 0;
}
.submain-head2 .i img {
vertical-align: top;
}
@media (max-width: 749px) {
.submain-head2 .i img {
width: 77px;
}
}
@media (min-width: 1200px) {
.submain-head2 p {
padding-top: 78px;
}
}
.submain-head2--sub3 {
display: flex;
justify-content: center;
padding: 0;
align-items: center;
}
.submain-head2--sub3 p {
padding-top: 0;
}
.submain-head2--sub3 .t1 {
display: block;
}
@media (max-width: 749px) {
.submain-head2--sub3 .t1 {
font-size: 20px;
}
}
@media (min-width: 1200px) {
.submain-head2--sub3 p {
padding-top: 50px;
}
.submain-head2--sub3 .t1 {
display: block;
font-size: 35px;
}
.submain-head2--sub3 .t2 {
font-size: 60px;
}
}
.submain-head2--sub7 {
gap: 37px;
display: flex;
justify-content: center;
padding: 0;
align-items: center;
letter-spacing: 0.8px;
}
.submain-head2--sub7 p {
padding-top: 0;
}
.submain-head2--sub7 .t2 {
margin-top: 12px;
line-height: 1.61;
}
@media (max-width: 749px) {
.submain-head2--sub7 .t1 {
font-size: 20px;
}
}
@media (min-width: 1200px) {
.submain-head2--sub7 p {
padding-top: 26px;
line-height: 1;
}
.submain-head2--sub7 .t1 {
font-size: 48px;
}
.submain-head2--sub7 .t2 {
display: block;
font-size: 19px;
}
}
.submain-head2--center {
display: flex;
justify-content: center;
padding: 0;
}
@media (max-width: 749px) {
.submain-head2--center {
align-items: center;
}
.submain-head2--center p {
padding: 0;
}
}
@media (max-width: 749px) and (min-width: 750px) {
.submain-head2--center p {
flex-basis: 180px;
}
}
@media (min-width: 750px) {
.submain-head2--center {
align-items: center;
}
.submain-head2--center p {
padding-top: 10px;
}
}
@media (min-width: 1200px) {
.submain-head2--center {
align-items: center;
}
.submain-head2--center br {
display: none;
}
}
.submain-head2--sub5 {
display: flex;
justify-content: center;
padding: 0;
line-height: 1.2;
}
.submain-head2--sub5 .i {
flex-shrink: 0;
}
.submain-head2--sub5 img {
vertical-align: top;
}
@media (min-width: 750px) {
.submain-head2--sub5 p {
font-size: 41.5px;
padding-top: 53px;
}
}

.smain4__head {
position: relative;
height: 196px;
padding-left: 66px;
font-size: 40px;
font-weight: 500;
color: #3c4552;
}
.smain4__head .tset {
text-align: center;
display: inline-block;
}
.smain4__head .t1::before {
content: "";
}
.smain4__head strong {
font-family: GmarketSans;
font-weight: bold;
color: var(--mid-blue);
}
.smain4__head-deco {
position: absolute;
right: 54px;
bottom: -30px;
}
.smain4__c1 {
display: flex;
}
@media (max-width: 749px) {
.smain4__c1 {
margin: 0 auto;
flex-direction: row;
justify-content: center;
align-items: center;
}
}
.smain4__c1 .i {
width: 178px;
text-align: center;
}
@media (max-width: 749px) {
.smain4__c1 .i {
width: 80px;
margin-right: 15px;
}
}
.smain4__c1 .i img {
transform: translateY(-23px);
}
@media (max-width: 749px) {
.smain4__c1 .i img {
width: 100%;
}
}
.smain4__c1 p {
padding-top: 44px;
font-size: 36px;
font-family: GmarketSans;
color: #3c4552;
letter-spacing: -0.9px;
line-height: 1.13;
}
@media (max-width: 749px) {
.smain4__c1 p {
padding-top: 0;
font-size: 25px;
}
}
.smain4__c1 .t1 {
font-size: 36px;
font-weight: bold;
color: var(--mid-blue);
}
@media (max-width: 749px) {
.smain4__c1 .t1 {
font-size: 25px;
}
}
.smain4__c1 .t2 {
font-size: 60px;
font-weight: 500;
}
@media (max-width: 749px) {
.smain4__c1 .t2 {
font-size: 25px;
}
}
.smain4__c2 .tit {
margin-bottom: 23px;
font-family: GmarketSans;
font-size: 27px;
line-height: 1;
font-weight: 500;
color: #161616;
}
.smain4__c2 .b {
display: flex;
gap: 26px;
}
.smain4__c2 .b dl {
width: 193px;
min-height: 74px;
padding: 10px 20px;
padding-top: 14px;
border-radius: 5px;
box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.1);
background-color: #fff;
}
@media (max-width: 749px) {
.smain4__c2 .b dl {
display: flex;
flex-wrap: wrap;
flex-direction: row;
justify-content: center;
align-items: center;
flex-direction: column;
text-align: center;
}
}
.smain4__c2 .b dt {
height: 16px;
margin-bottom: 11px;
font-family: GmarketSans;
font-size: 18px;
font-weight: bold;
line-height: 1.33;
color: var(--teal);
}
.smain4__c2 .b dd {
margin-top: 11px;
font-family: GmarketSans;
font-size: 17px;
font-weight: 500;
line-height: 1.33;
color: #161616;
}
.smain4__c2 .b ul {
font-family: GmarketSans;
font-weight: 500;
line-height: 1.88;
color: #161616;
}
.smain4__c2 .b li {
padding-left: 9px;
position: relative;
}
.smain4__c2 .b li:before {
content: "";
position: absolute;
top: 6.5px;
transform: translateY(4px);
left: 0;
width: 3px;
height: 3px;
border-radius: 3px;
background-color: #161616;
}
.smain4__c2 .b em {
color: #e34679;
}

.s-mid {
display: grid;
gap: 15px;
margin-top: 20px;
}
@media (min-width: 1200px) {
.s-mid {
margin-top: 60px;
grid-template-columns: repeat(2, 1fr);
gap: 40px;
}
}

.submain-mid-box {
position: relative;
padding: 30px;
padding-right: 10px;
border-radius: 10px;
background-color: #edf7f4;
display: grid;
overflow: hidden;
}
@media (max-width: 749px) {
.submain-mid-box {
padding: 18px;
gap: 20px;
}
}
@media (min-width: 750px) {
.submain-mid-box {
grid-template-columns: minmax(90px, 17.3076923077%) auto;
gap: 30px;
}
}
@media (min-width: 1200px) {
.submain-mid-box {
min-height: 200px;
}
}
.submain-mid-box--add-btn {
padding-bottom: 75px;
}
.submain-mid-box .i {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
background-color: #fff;
aspect-ratio: 1/1;
border-radius: 100%;
}
@media (max-width: 749px) {
.submain-mid-box .i {
width: 90px;
margin: 0 auto;
}
}
@media (min-width: 750px) {
.submain-mid-box .i {
width: 100%;
}
}
.submain-mid-box .i img {
vertical-align: top;
}
.submain-mid-box .tit {
margin-bottom: 15px;
font-family: GmarketSans;
font-size: 24px;
line-height: 1.25;
text-align: left;
color: var(--black);
font-weight: 500;
}
.submain-mid-box .tit em {
font-weight: bold;
}
.submain-mid-box p {
line-height: 1.5;
letter-spacing: -0.4px;
}
.submain-mid-box--blue {
background-color: #e2edfe;
}
.submain-mid-box-btn {
min-height: 50px;
padding: 17px;
text-align: center;
background-color: var(--teal);
position: absolute;
bottom: 0;
left: 0;
width: 100%;
color: #fff;
font-family: GmarketSans;
line-height: 17px;
}
.submain-mid-box-btn::after {
content: "";
margin-left: 10px;
background: url(/static/portal/img/submain4/btn-arr.png) 0 0 no-repeat;
width: 17px;
height: 17px;
display: inline-block;
vertical-align: middle;
}
.submain-mid-box-btn--blue {
background-color: var(--mid-blue);
}
.submain-mid-box-btn--blue::after {
content: "";
}

.submain-bottom {
display: grid;
gap: 15px;
}
@media (max-width: 749px) {
.submain-bottom {
margin-top: 20px;
}
}
@media (min-width: 750px) {
.submain-bottom {
margin: 30px -26px 0;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
}
}
@media (min-width: 1200px) {
.submain-bottom {
margin: 60px -26px 0;
gap: 0;
grid-template-columns: 246fr 246fr 246fr 260fr;
}
}
@media (max-width: 1199px) {
.submain-bottom--7 {
margin-left: 0;
margin-right: 0;
}
}
@media (min-width: 1200px) {
.submain-bottom--7 {
grid-template-columns: repeat(7, 1fr);
}
}
@media (max-width: 749px) {
.submain-bottom--7 .submain-bottom__service br {
display: none;
}
.submain-bottom--7 .submain-bottom__service .i {
display: block;
}
}
@media (max-width: 1199px) {
.submain-bottom--7 .submain-bottom__service:nth-child(odd) {
border-left: none;
}
}
@media (max-width: 1199px) {
.submain-bottom--7 .submain-bottom__service {
padding-top: 10px;
height: 60px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.submain-bottom--7 .submain-bottom__service a {
margin: 0;
}
.submain-bottom--7 .submain-bottom__service .i {
top: 0;
position: static;
}
}
@media (min-width: 1200px) {
.submain-bottom--7 .submain-bottom__service {
height: 140px;
}
}
.submain-bottom__service-tit {
margin-bottom: 11px;
font-family: GmarketSans;
font-size: 24px;
font-weight: 500;
text-align: left;
color: var(--black);
}
.submain-bottom__service-tit span {
display: inline-block;
padding-right: 33px;
background: url(/static/portal/img/submain4/arrow.png) right 12px no-repeat;
}
@media (max-width: 749px) {
.submain-bottom__service-tit br {
display: none;
}
}
.submain-bottom__service-tit em {
font-weight: bold;
}
.submain-bottom__service-tit--7 {
font-size: 20px;
line-height: 1;
display: block;
}
.submain-bottom__service-tit--7 span {
background-position: right center;
}
.submain-bottom__service {
position: relative;
padding: 0 0 0 26px;
}
@media (min-width: 750px) {
.submain-bottom__service + * {
border-left: 1px solid var(--bd-color);
}
}
@media (max-width: 1199px) {
.submain-bottom__service:nth-child(3) {
border: none;
}
}
.submain-bottom__service p {
line-height: 1.5;
letter-spacing: -0.4px;
}
.submain-bottom__service ul {
margin-top: 20px;
}
.submain-bottom__service ul a {
display: block;
padding-left: 16px;
position: relative;
font-family: GmarketSans;
font-weight: 500;
line-height: 1.88;
text-align: left;
color: var(--black);
}
.submain-bottom__service ul a:before {
content: "";
position: absolute;
top: 6.5px;
transform: translateY(4px);
left: 0;
width: 3px;
height: 3px;
border-radius: 3px;
background-color: #333333;
}
.submain-bottom__service .i {
position: absolute;
bottom: 0;
right: 26px;
width: 60px;
height: 60px;
border-radius: 60px;
background-color: #f3f3f3;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
@media (max-width: 749px) {
.submain-bottom__service .i {
display: none;
}
}

.bu-dot-blue {
margin-top: 11px;
display: flex;
flex-wrap: wrap;
gap: 5px;
}
@media (max-width: 749px) {
.bu-dot-blue {
flex-direction: column;
}
.submain-1 .bu-dot-blue {
margin-left: -90px;
}
}
.bu-dot-blue li {
padding-left: 16px;
position: relative;
}
@media (min-width: 750px) {
.bu-dot-blue li {
width: calc(50% - 5px);
}
}
.bu-dot-blue li:before {
content: "";
position: absolute;
top: 5.5px;
transform: translateY(4px);
left: 0;
width: 5px;
height: 5px;
border-radius: 5px;
background-color: var(--mid-blue);
}
.bu-dot-blue a {
font-family: GmarketSans;
font-weight: 500;
}

.sub5-sh {
margin: 30px 0;
display: flex;
gap: 10px;
}
@media (max-width: 1199px) {
.sub5-sh {
flex-wrap: wrap;
}
}
.sub5-sh label {
height: 90px;
border-radius: 10px;
box-shadow: 0px 3px 7px 0 rgba(0, 99, 197, 0.15);
border: solid 1px #c6d6e6;
background-color: #fff;
text-align: center;
line-height: 1;
/* prettier-ignore */
}
@media (max-width: 749px) {
.sub5-sh label {
width: calc((100% - 20px) / 3);
}
}
@media (min-width: 750px) {
.sub5-sh label {
width: calc((100% - 40px) / 5);
}
}
@media (min-width: 1200px) {
.sub5-sh label {
flex-grow: 1;
}
}
.sub5-sh label input {
position: absolute;
opacity: 0;
}
.sub5-sh label i {
display: block;
height: 60px;
background-color: #0063c5;
-webkit-mask-image: url(/static/portal/img/submain5/icon-01@2x.png);
mask-image: url(/static/portal/img/submain5/icon-01@2x.png);
-webkit-mask-size: auto 30px;
mask-size: auto 30px;
-webkit-mask-position: center center;
mask-position: center center;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
}
.sub5-sh label i.i2 {
-webkit-mask-image: url(/static/portal/img/submain5/icon-02@2x.png);
mask-image: url(/static/portal/img/submain5/icon-02@2x.png);
}
.sub5-sh label i.i3 {
-webkit-mask-image: url(/static/portal/img/submain5/icon-03@2x.png);
mask-image: url(/static/portal/img/submain5/icon-03@2x.png);
}
.sub5-sh label i.i4 {
-webkit-mask-image: url(/static/portal/img/submain5/icon-04@2x.png);
mask-image: url(/static/portal/img/submain5/icon-04@2x.png);
}
.sub5-sh label i.i5 {
-webkit-mask-image: url(/static/portal/img/submain5/icon-05@2x.png);
mask-image: url(/static/portal/img/submain5/icon-05@2x.png);
}
.sub5-sh label i.i6 {
-webkit-mask-image: url(/static/portal/img/submain5/icon-06@2x.png);
mask-image: url(/static/portal/img/submain5/icon-06@2x.png);
}
.sub5-sh label i.i7 {
-webkit-mask-image: url(/static/portal/img/submain5/icon-07@2x.png);
mask-image: url(/static/portal/img/submain5/icon-07@2x.png);
}
.sub5-sh label i.i8 {
-webkit-mask-image: url(/static/portal/img/submain5/icon-08@2x.png);
mask-image: url(/static/portal/img/submain5/icon-08@2x.png);
}
.sub5-sh label i.i9 {
-webkit-mask-image: url(/static/portal/img/submain5/icon-09@2x.png);
mask-image: url(/static/portal/img/submain5/icon-09@2x.png);
}
.sub5-sh label i.i10 {
-webkit-mask-image: url(/static/portal/img/submain5/icon-10@2x.png);
mask-image: url(/static/portal/img/submain5/icon-10@2x.png);
}
.sub5-sh label i.i11 {
-webkit-mask-image: url(/static/portal/img/submain5/icon-11@2x.png);
mask-image: url(/static/portal/img/submain5/icon-11@2x.png);
}
.sub5-sh label i.i12 {
-webkit-mask-image: url(/static/portal/img/submain5/icon-12@2x.png);
mask-image: url(/static/portal/img/submain5/icon-12@2x.png);
}
.sub5-sh label i.i13 {
-webkit-mask-image: url(/static/portal/img/submain5/icon-13@2x.png);
mask-image: url(/static/portal/img/submain5/icon-13@2x.png);
}
.sub5-sh label i.i14 {
-webkit-mask-image: url(/static/portal/img/submain5/icon-14@2x.png);
mask-image: url(/static/portal/img/submain5/icon-14@2x.png);
}
.sub5-sh label i.i15 {
-webkit-mask-image: url(/static/portal/img/submain5/icon-15@2x.png);
mask-image: url(/static/portal/img/submain5/icon-15@2x.png);
}
.sub5-sh label span {
display: block;
}
.sub5-sh label:has(:checked) {
color: #fff;
background-image: linear-gradient(to top, #0064c6, #007edc);
}
.sub5-sh label:has(:checked) i {
background-color: #fff;
}
.sub5-sh label:has(:focus) {
outline: 1px dashed;
}

.sub5-input-group {
display: grid;
grid-template-columns: auto 50px;
gap: 5px;
}
@media (min-width: 750px) {
.sub5-input-group {
gap: 10px;
max-width: 650px;
margin: 30px auto 60px;
}
}
.sub5-input-group .group {
height: 50px;
border-radius: 10px;
border: solid 1px #0063c5;
background-color: #fff;
display: grid;
grid-template-columns: auto 90px;
}
@media (min-width: 750px) {
.sub5-input-group .group {
width: 590px;
}
}
.sub5-input-group .group input {
border: none;
height: 48px;
padding-left: 16px;
background-color: transparent;
}
.sub5-input-group .group button {
height: 48px;
}
.sub5-input-group .btn-reset {
width: 50px;
height: 50px;
}

.submain-9 {
position: relative;
}
.submain-9 .submain-9-txt {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 11;
pointer-events: none;
}
.submain-9 .box_copy_4 {
border-radius: 10px;
background-color: rgb(8, 20, 49);
position: absolute;
left: 589px;
top: 230px;
width: 1071px;
height: 590px;
z-index: 22;
}
@media (max-width: 749px) {
.submain-9 {
margin-left: -20px;
margin-right: -20px;
margin-left: -10px;
margin-right: -10px;
}
}
.submain-9 .submain-9-swiper {
box-shadow: 0px 10px 16px 4px rgba(0, 0, 0, 0.1);
}
@media (min-width: 750px) {
.submain-9 .submain-9-swiper {
border-radius: 10px;
}
}
.submain-9 .swiper-slide img {
width: 100%;
vertical-align: top;
}
.submain-9 .swiper-slide .n {
position: absolute;
z-index: 11111;
}
.submain-9 .swiper-button-next,
.submain-9 .swiper-button-prev {
--swiper-navigation-sides-offset: 30px;
border-radius: 50%;
box-shadow: 0px 0px 14.55px 0.45px rgba(0, 0, 0, 0.15);
width: 50px;
height: 50px;
background-color: transparent;
background-image: url("/static/portal/img/submain9/next.png");
background-repeat: no-repeat;
background-size: 50px 50px;
}
@media (max-width: 749px) {
.submain-9 .swiper-button-next,
.submain-9 .swiper-button-prev {
--swiper-navigation-sides-offset: 0;
}
}
@media (-webkit-min-device-pixel-ratio: 2) {
.submain-9 .swiper-button-next,
.submain-9 .swiper-button-prev {
background-image: url("/static/portal/img/submain9/next@2x.png");
}
}
.submain-9 .swiper-button-next::after,
.submain-9 .swiper-button-prev::after {
display: none;
}
.submain-9 .swiper-button-next:focus,
.submain-9 .swiper-button-prev:focus {
outline: 1px dashed #000;
}
.submain-9 .swiper-button-prev {
transform: rotate(180deg);
}

.submain-9-ctrl {
position: relative;
z-index: 1;
display: grid;
margin-top: -26px;
}
@media (max-width: 749px) {
.submain-9-ctrl {
margin: -26px 0 0;
}
}
@media (min-width: 750px) {
.submain-9-ctrl {
margin: -26px 25px 0;
}
}
.submain-9-ctrl dt {
font-family: "Gmarket Sans";
color: rgb(255, 255, 255);
line-height: 1.5;
background-image: linear-gradient(125deg, #0063ba, #009c98);
box-shadow: 1.5px 2.6px 13px 0 rgba(33, 99, 193, 0.31);
height: 53px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
border-radius: 5px;
position: relative;
z-index: 10;
}
@media (max-width: 749px) {
.submain-9-ctrl dt {
display: none;
}
}
.submain-9-ctrl dd {
position: relative;
}
.submain-9-ctrl__bar {
transition: all 0.5s ease-in-out;
position: absolute;
top: 18px;
left: 0;
left: calc(8.33% - 13px);
height: 16px;
width: 10%;
border-radius: 0 50px 50px 0;
border-radius: 50px;
background-color: #fff;
background-image: linear-gradient(to right, #009c98 25%, #fff 95%);
z-index: 1;
}
.submain-9-ctrl ul {
position: relative;
display: grid;
grid-template-columns: repeat(6, 1fr);
gap: 10px;
}
.submain-9-ctrl ul::before {
content: "";
top: 18px;
left: 0;
left: 8.33%;
position: absolute;
height: 16px;
width: calc(91.67% + 13px);
width: calc(83.34% + 13px);
border-radius: 0 50px 50px 0;
background-color: #fff;
}
@media (max-width: 749px) {
.submain-9-ctrl ul::before {
border-radius: 50px;
}
}
.submain-9-ctrl li {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.submain-9-ctrl button,
.submain-9-ctrl a {
position: relative;
z-index: 20;
height: 70px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: flex-end;
line-height: 1;
font-family: "Gmarket Sans";
}
@media (max-width: 749px) {
.submain-9-ctrl button,
.submain-9-ctrl a {
font-size: 12px;
}
}
.submain-9-ctrl button .marker,
.submain-9-ctrl a .marker {
position: absolute;
top: -18px;
width: 18px;
height: 26px;
background-image: url("/static/portal/img/submain9/la-map-marker-alt.png");
background-repeat: no-repeat;
background-size: 18px 26px;
}
@media (-webkit-min-device-pixel-ratio: 2) {
.submain-9-ctrl button .marker,
.submain-9-ctrl a .marker {
background-image: url("/static/portal/img/submain9/la-map-marker-alt@2x.png");
}
}
.submain-9-ctrl button .dot,
.submain-9-ctrl a .dot {
border-radius: 50%;
background-color: rgb(33, 99, 193);
position: absolute;
top: 21px;
width: 10px;
height: 10px;
z-index: 55;
}

@font-face {
font-family: JalnanOTF;
src: url("/static/font/JalnanOTF00.woff") format("woff");
font-weight: normal;
font-style: normal;
font-stretch: normal;
}
@media (min-width: 750px) {
#submain.submain8 {
background-image: url(/static/portal/img/submain8/visual8.jpg);
}
}
.submain-8__visual {
position: relative;
padding-top: 145px;
}
@media (min-width: 750px) {
.submain-8__visual {
height: 456px;
}
}
@media (max-width: 749px) {
.submain-8__visual {
background: url(/static/portal/img/submain8/visual.png) center 0 no-repeat;
background-size: auto 150px;
padding-bottom: 30px;
}
}
.submain-8__visual p {
width: 100%;
font-family: JalnanOTF;
font-size: 42px;
line-height: 1;
text-align: center;
color: rgb(53, 67, 82);
}
@media (max-width: 749px) {
.submain-8__visual p {
font-size: 27px;
line-height: 1.4;
}
}
.submain-8__visual p span {
display: block;
margin-top: 16px;
font-size: 38px;
}
@media (max-width: 749px) {
.submain-8__visual p span {
margin-top: 0;
font-size: 25px;
}
}
.submain-8__visual p em {
color: var(--mid-blue);
}
.submain-8__links {
display: grid;
grid-template-columns: repeat(5, 1fr);
max-width: 900px;
margin: 0 auto;
}
@media (max-width: 749px) {
.submain-8__links {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 10px;
}
}
.submain-8__links a {
font-family: "Gmarket Sans";
color: rgb(255, 255, 255);
font-weight: bold;
line-height: 1.2;
text-align: center;
position: relative;
aspect-ratio: 230/170;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
@media (max-width: 749px) {
.submain-8__links a {
font-size: 19px;
width: calc((100% - 20px) / 3);
}
}
@media (min-width: 750px) {
.submain-8__links a {
font-size: 28px;
}
}
.submain-8__links a::before {
position: absolute;
content: "";
background: url(/static/portal/img/submain8/btn1.png) 0 0 no-repeat;
width: 130%;
max-width: 230px;
background-size: cover;
aspect-ratio: 230/170;
}
.submain-8__links a.type2::before {
background-image: url(/static/portal/img/submain8/btn2.png);
}
.submain-8__links a span {
position: relative;
z-index: 1;
}
@media (min-width: 750px) {
.submain-8__notice-group {
margin-top: 70px;
display: grid;
grid-template-columns: 1fr 5.5555555556% 1fr;
gap: 30px;
}
.submain-8__notice-group .l {
display: block;
height: 100%;
text-align: center;
}
.submain-8__notice-group .l::before {
content: "";
display: inline-block;
width: 1px;
height: 100%;
border-left: 1px solid var(--bd-color);
}
}
@media (max-width: 749px) {
.submain-8__notice {
margin-top: 40px;
}
}
.submain-8__notice a {
display: block;
word-break: break-all;
overflow: hidden;
text-overflow: ellipsis;
display: block;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.ie .submain-8__notice a {
display: block;
height: 16px;
overflow: hidden;
}
.submain-8__notice a::before {
content: "· ";
}

@media (min-width: 750px) {
#submain.submain10 {
background-image: url(/static/portal/img/submain10/visual10.png);
}
}

.submain-10__visual {
position: relative;
padding-top: 150px;
}
@media (min-width: 750px) {
.submain-10__visual {
height: 456px;
padding-top: 175px;
}
}
@media (max-width: 749px) {
.submain-10__visual {
background: url(/static/portal/img/submain10/visual.png) center 0 no-repeat;
background-size: auto 150px;
padding-bottom: 30px;
}
}
.submain-10__visual p {
width: 100%;
font-family: JalnanOTF;
font-size: 40px;
line-height: 1;
text-align: center;
color: rgb(53, 67, 82);
}
@media (min-width: 1200px) {
.submain-10__visual p {
width: 58%;
min-width: 500px;
}
}
@media (max-width: 749px) {
.submain-10__visual p {
font-size: 26px;
line-height: 1.4;
}
}
.submain-10__visual p span {
display: block;
margin-top: 16px;
}
@media (max-width: 749px) {
.submain-10__visual p span {
margin-top: 0;
}
}
.submain-10__visual p em {
color: var(--mid-blue);
}
.submain-10__links {
display: flex;
gap: 10px;
justify-content: center;
margin: 0 auto;
}
@media (max-width: 749px) {
.submain-10__links {
flex-wrap: wrap;
}
}
@media (min-width: 750px) {
.submain-10__links {
padding: 14px 0 0 65px;
}
}
.submain-10__links a {
font-family: "Gmarket Sans";
color: rgb(255, 255, 255);
font-weight: bold;
line-height: 1.2;
letter-spacing: -0.65px;
text-align: center;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
border-radius: 14px;
box-shadow: 3px 4px 35px 0 rgba(0, 0, 0, 0.25);
background-color: var(--teal);
}
@media (max-width: 749px) {
.submain-10__links a {
font-size: 19px;
width: calc((100% - 10px) / 2);
padding: 22px;
}
}
@media (min-width: 750px) {
.submain-10__links a {
width: 343px;
min-height: 84px;
padding: 30px 22px 22px 22px;
font-size: 26px;
}
}
.submain-10__links a.type2 {
background-color: var(--tomato);
}
.submain-10__links a span {
position: relative;
z-index: 1;
}
@media (min-width: 750px) {
.submain-10__notice-group {
padding-left: 50px;
margin-top: 102px;
display: grid;
grid-template-columns: 1fr 5.5555555556% 1fr;
gap: 30px;
}
.submain-10__notice-group .l {
display: block;
height: 100%;
text-align: center;
}
.submain-10__notice-group .l::before {
content: "";
display: inline-block;
width: 1px;
height: 100%;
border-left: 1px solid var(--bd-color);
}
}
@media (max-width: 749px) {
.submain-10__notice {
margin-top: 40px;
}
}
.submain-10__notice a {
display: block;
word-break: break-all;
overflow: hidden;
text-overflow: ellipsis;
display: block;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.ie .submain-10__notice a {
display: block;
height: 16px;
overflow: hidden;
}
.submain-10__notice a::before {
content: "· ";
}
/*# sourceMappingURL=submain.css.map */