/* ===================================================================================================================== */
/* ======================================================= sub2 코드 ==================================================== */
/* ===================================================================================================================== */

.special01-bg {background: url(../img/custom/special01_bg.jpg) center/cover no-repeat;}
.special01-area1 {background: url(../img/custom/special01_bg1.jpg) center/cover no-repeat; color: #fff;}
.special01-area2 article {position: relative;}
.special01-area2 article::before {position: absolute; content: ''; top: 50%; left: 0; transform: translateY(-50%); width: 100%; height: 260px; background: #f7f7f7;}
.special01-area2 ul.flex {flex-wrap: nowrap;}
.special01-area3 .tit {display: inline-block; padding: 10px 42px; border-radius: 40px; color: #fff; background: #969696;}
.special01-area3 .sub {padding: 8px 10px; color: #fff; background: #969696;}
.special01-area3 ul.flex > li:last-child .tit,
.special01-area3 ul.flex > li:last-child article .sub {background: linear-gradient(to right, #1f3d74, #4067aa);}
.special01-area3 .emphasis {padding: 5px 10px; max-width: 220px; width: 100%; margin: 20px auto 0; background: #fbfbfb; border: 1px solid #ddd;}
.special01-area3 .emphasis span {color: #ff3535;}
.special01-area4 ul.flex p {display: flex; align-items: center; justify-content: center; height: 80px; font-weight: 800; line-height: 1.5; color: #fff; background: #aeaeae}
.special01-area5 {background: url(../img/custom/special01_bg2.jpg) center/cover no-repeat; color: #fff;}

.special02-area1 {padding: 80px 0 !important;}
.special02-area2 ul > li p {position: relative; padding: 10px 20px; text-align: center; color: #fff;}
.special02-area2 ul > li p::before {position: absolute; content: ''; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background: linear-gradient(to right, #1f3d74, #4067aa); transform: skew(-15deg);}
.special02-area2 ul > li:not(:first-child) {margin-top: 10px;}
.special02-area2 article {padding: 25px 20px; text-align: center; border: 1px solid #ccc;}
.special02-area3 {background: url(../img/custom/special02_bg1.jpg) center/cover no-repeat;}
.special02-area3 ul.flex > li > div {padding: 8px 10px; border-left: 3px solid #1f3d74; border-right: 3px solid #1f3d74; background: rgba(255,255,255,0.9);}



/*================================================================ 1500px 이하 ================================================================= */
@media screen and (max-width:1500px) {

}

/*================================================================ 1200px 이하 ================================================================= */
@media screen and (max-width:1200px) {
.special01-area2 article::before {display: none;}
.special01-area2 ul.flex {flex-direction: column-reverse; text-align: center; padding: 30px 20px; max-width: 600px; border-radius: 20px; border: 1px solid #ccc; background: #ebf0f2;}
.special01-area2 article:last-of-type ul.flex {flex-direction: column;}
.special01-area2 ul.flex .txt {margin: 30px 0 20px;}
}

/*================================================================ 1025px 이하 ================================================================= */
@media screen and (max-width:1025px) {

}

/*================================================================ 900px 이하 ================================================================= */
@media screen and (max-width:900px) {

}

/*================================================================ 769px 이하 ================================================================= */
@media screen and (max-width:769px) {
.special01-area2 article {padding: 0 10px;}
.special01-area2 ul.flex {max-width: 100%;}
.special01-area3 ul.flex img {width: 100%;}
.special01-area3 .inner > ul.flex > li:last-child {margin-top: 40px;}
.special01-area4 ul.flex img {width: 100%;}

.denture-area1 .inner {overflow-x: scroll;}
.denture-area1 table {min-width: 900px;}
}

/*================================================================ 600px 이하 ================================================================= */
@media screen and (max-width:600px) {
.denture-area1 table {min-width: 800px;}
}

/*================================================================ 425px 이하 ================================================================= */
@media screen and (max-width:425px) {
.special01-area2 ul.flex .img {max-width: 220px;}
.special01-area3 .inner > ul.flex > li:last-child {margin-top: 20px;}
.special01-area3 .tit {padding: 5px 30px;}
.special01-area3 .sub {padding: 4px 10px;}
.special01-area3 .emphasis {max-width: 160px; margin: 10px auto 0;}
.special01-area4 ul.flex p {height: 50px;}
.special01-area5 .middle-title h6 .x1_5 {font-size: 1.4em;}

.special02-area1 {padding: 60px 0 !important;}

.denture-area1 table {min-width: 620px;}
}


/* ===================================================================================================================== */
/* ======================================================= sub2 코드 ==================================================== */
/* ===================================================================================================================== */


/* ===================================================================================================================== */
/* ======================================================= sub3 코드 ==================================================== */
/* ===================================================================================================================== */


.imp-sp01-area1 .basic-box::before {position: absolute; content: ''; right: 0; bottom: 0; width: 250px; height: 250px; background: url(../img/custom/logo.png) center/cover no-repeat;}
.imp-sp01-area3 {background: url(../img/custom/imp_special01_bg1.jpg) center/cover no-repeat;}
.imp-sp01-area3 article {position: relative; display: inline-block; margin-top: 120px;}
.imp-sp01-area3 article::before {position: absolute; content: ''; right: -100px; top: -110px; width: 230px; height: 230px; background: url(../img/custom/imp_special01_13.png) center/cover no-repeat;}
.imp-sp01-area4 {padding: 80px 0 !important;}

.imp-sp02-area1 article {background: linear-gradient(to top, #fbfbfb 240px, transparent 240px);}
.imp-sp02-area1 article ul.flex {align-items: flex-end;}
.imp-sp02-area1 article ul.flex > li:first-child {padding-bottom: 60px;}
.imp-sp02-area1 article ul.flex > li:last-child > div::after {position: absolute; content: ''; right: -120px; bottom: 30px; width: 180px; height: 180px; background: url(../img/custom/logo.png) center/cover no-repeat;}
.imp-sp02-area1 article ul.flex p {line-height: 2;}
.imp-sp02-area2 {color: #fff;}
.imp-sp02-area2 ul.flex > li > div {display: flex; align-items: center; padding: 30px 60px; height: 500px; background: url(../img/custom/imp_special02_03.jpg) center/cover no-repeat}
.imp-sp02-area2 ul.flex > li:last-child > div {background: url(../img/custom/imp_special02_04.jpg) center/cover no-repeat}
.imp-sp02-area2 ul.flex .noto {position: relative; top: 20px;}
.imp-sp02-area3 ul.flex img {width: 100%;}
.imp-sp02-area3 article {border: 1px solid #ccc; border-top: 0;}
.imp-sp02-area3 article h5 {padding: 8px 10px; color: #fff; background: #969696;}
.imp-sp02-area3 article p {padding: 20px 10px;}
.imp-sp02-area3 ul.flex > li:last-child article h5 {background: linear-gradient(to right, #1f3d74, #4067aa);}
.imp-sp02-area4 ul.flex {position: relative; display: flex; justify-content: center;}
.imp-sp02-area4 ul.flex::after {position: absolute; content: ''; display: block; top: 10px; width: calc(100% - 25%); height: 2px; background-color: #b6b6b6; z-index: 0;}
.imp-sp02-area4 ul.flex > li::before {position: relative; content: attr(data-number); display: flex; justify-content: center; align-items: center; left: 50%; top: -10px; transform: translateX(-50%);
width: 40px; height: 40px; background-color: #244683; color: #fff; border-radius: 50%; font-size: 20px; z-index: 1; font-weight: 500;}
.imp-sp02-area4 ul.flex p {display: flex; align-items: center; justify-content: center; height: 80px; font-weight: 700; line-height: 1.5; color: #fff; background: #333;}
.imp-sp02-area5 {background: url(../img/custom/imp_special02_bg1.jpg) center/cover no-repeat; color: #fff;}
.imp-sp02-area6.photo-table table thead tr:last-of-type td:last-child {background: linear-gradient(to right, #1f3d74, #4067aa);}
.imp-sp02-area6.photo-table table tbody td:last-child {color: #2a5297; font-weight: 900;}



/*================================================================ 1500px 이하 ================================================================= */
@media screen and (max-width:1500px) {

}

/*================================================================ 1200px 이하 ================================================================= */
@media screen and (max-width:1200px) {

}

/*================================================================ 1025px 이하 ================================================================= */
@media screen and (max-width:1025px) {

}

/*================================================================ 900px 이하 ================================================================= */
@media screen and (max-width:900px) {
.imp-sp01-area3 article {margin-top: 60px;}
.imp-sp01-area3 article::before {right: 0; top: -50px; width: 210px; height: 210px;}

.imp-sp02-area1 article ul.flex img {max-width: 200px;}
.imp-sp02-area2 ul.flex > li {width: 100%;}
.imp-sp02-area2 ul.flex > li > div {height: 380px;}
}

/*================================================================ 769px 이하 ================================================================= */
@media screen and (max-width:769px) {
.imp-sp02-area1 {margin-bottom: 80px;}
.imp-sp02-area1 article {margin-top: 60px; background: none;}
.imp-sp02-area1 article ul.flex {padding: 30px 20px; border-radius: 40px; text-align: center; flex-direction: column-reverse; border: 1px solid #ccc; background: #ebf0f2;}
.imp-sp02-area1 article ul.flex > li:first-child {padding: 0; margin-top: 20px;}
.imp-sp02-area1 article ul.flex > li:last-child > div::after {right: 0;}
.imp-sp02-area3 ul.flex {max-width: 400px;}
.imp-sp02-area4 ul.flex::after {display: none;}
.imp-sp02-area4 ul.flex > li {max-width: 300px;}
.imp-sp02-area4 ul.flex > li:nth-child(n+3):nth-child(-n+4) {margin-top: 40px;}
}

/*================================================================ 600px 이하 ================================================================= */
@media screen and (max-width:600px) {
.imp-sp02-area2 ul.flex > li > div {padding: 20px 40px;}
}

/*================================================================ 425px 이하 ================================================================= */
@media screen and (max-width:425px) {
.imp-sp01-area3 article::before {top: -65px; width: 130px; height: 130px;}
.imp-sp01-area4 {padding: 60px 0 !important;}

.imp-sp02-area1 {margin-bottom: 60px;}
.imp-sp02-area2 ul.flex > li > div {padding: 20px 30px; height: 190px;}
.imp-sp02-area2 ul.flex > li:last-child > div {height: 330px;}
.imp-sp02-area4 ul.flex > li::before {top: -5px; width: 30px; height: 30px; font-size: 15px;}
.imp-sp02-area4 ul.flex > li:nth-child(n+3):nth-child(-n+4) {margin-top: 30px;}
.imp-sp02-area4 ul.flex p {height: 50px;}
.imp-sp02-area5 {background-position-x: -950px;}
.imp-sp02-area6.photo-table table thead tr:last-of-type td {font-size: 13px;}
}


/* ===================================================================================================================== */
/* ======================================================= sub3 코드 ==================================================== */
/* ===================================================================================================================== */



/* 케이스 */
.case-section .case-section-con h5{
    background-color: #003377;
    color: #fff;
    font-weight: 700;
    border-radius: 999px;
    text-align: center;
    margin: 80px auto 30px auto;
    width: 170px;

}
.case-section .case-section-con img{
    width: 100%;
}
.case-section .case-section-con li > div{
    padding: 4px;
}
.case-section .case-section-con li > div > div:last-child{
    text-align: center;
    font-weight: 700;
    font-size: 1.4rem;
}
.case-section .case-section-con li:last-child > div {
    background-color: #003377;
    color: #fff;
}
.case-section .case-section-con li:last-child > div > div:first-child {
    box-sizing: border-box;
}