
/* start : sub_visual*/
.clearfix {
    display:block;
    clear:both;
}
.mo_br {
    display:block;
}
p {
    letter-spacing:-0.6px;
}
span {
    letter-spacing:-0.6px;
}



.sub .visual {
    width:100%;
    height:570px;
    position:relative;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}
.sub .visual::after {
    content:'';
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,0.3);
}
.sub01 .visual {
    background:url(../img/sub/sub_visual1.png) center;
}
.sub02 .visual {
    background:url(../img/sub/sub_visual2.png) center;
}
.sub03 .visual {
   background:url(../img/sub/sub_visual3.png) center;
}
.sub04 .visual {
    background:url(../img/sub/sub_visual4.png) center;
}
#product01 .visual {
    background:url(../img/sub_visual_01.jpg) center;
}
#product03 .visual {
    background:url(../img/sub_visual_01.jpg) center;
}
#board_list01 .visual {
    background:url(../img/sub_visual_01.jpg) center;
}
#board_list02 .visual {
    background-image:url(../img/sub_visual_01.jpg);
}
#board_webzine01 .visual {
     background:url(../img/sub/sub_visual1.png) center;
}
#board_webzine02 .visual {
    background-image:url(../img/sub_visual_01.jpg);
}
#board_gallery01 .visual {
    background-image:url(../img/sub_visual_01.jpg);
}
#board_gallery02 .visual {
    background-image:url(../img/sub_visual_01.jpg);
}
#board_gallery03 .visual {
    background-image:url(../img/sub_visual_01.jpg);
}
.visual .text_box {
    position:absolute;
    top:60%;
    left:50%;
    transform:translate(-50%, -50%);
    text-align:center;
    z-index:9;
}
.visual .text_box h2 {
    font-size:3em;
    font-weight:bold;
    color:#333;
    color:#fff;
}
.visual .text_box p {
    font-size:1em;
    font-weight:400;
    color:#333;
    padding-top:5%;
    color:#f6f6f6;
}
/*end:sub_visual*/


/* sub common */
.sub {width:100%; position: relative;}



/* 치과소개 */

#introduce { }
#introduce .subtit30 {margin-bottom:50px;}
#introduce .titbox { margin:100px 0 100px 0; text-align: center;}
#introduce .sec1 {width:100%;  text-align: center;    }
#introduce .sec1 .maintit40 { }
#introduce .sec1 .secbg { display: flex; align-items: center; justify-content: center; height:580px; }
#introduce .sec11 {background:url(../img/sub/sec111.png) center; }
#introduce .sec12 { height:580px; background:url(../img/sub/sec112.png) center; }
#introduce .sec12 .txtbox {float:left;}
#introduce .sec13 { height:580px; background:url(../img/sub/sec113.png) center; }
#introduce .sec14 { height:580px; background:url(../img/sub/sec114.png) center; }

#introduce .sec2  {width:100%;   }
#introduce .sec2 .txtbox {margin-left:50px;}
#introduce .sec2 .wrap1400 {display: flex; align-items:center;}
#introduce .sec2 .txtbox .maintit40 {margin-bottom:30px;}
#introduce .sec2 .txtbox .subtit25 {color:#666;}
#introduce .sec2 .txtbox, #introduce .sec2 .imgbox{width:50%;}

#introduce .sec3  {width:100%;  margin-bottom:50px;  }
#introduce .sec3 .txtbox {margin-left:50px;}
#introduce .sec3 .wrap1400 {display: flex; align-items:center;}
#introduce .sec3 .txtbox .maintit40 {margin-bottom:30px;}
#introduce .sec3 .txtbox .maintit30 {margin-bottom:10px;}
#introduce .sec3 .txtbox .subtit25 {color:#666;}
#introduce .sec3 .txtbox, #introduce .sec3 .imgbox{width:50%;}
#introduce .sec3 .imgbox .mapWrap{width:100%; }
.root_daum_roughmap .wrap_map {height:700px !important;}
.txtbox2 { border-bottom:1px solid #e5e5e5;  padding:10px 0 10px 0;}
.txtbox2 .ul-wrap {display: flex;}
.txtbox2 .ul-wrap ul { }
.txtbox2 .ul-wrap ul li {   font-size:1.5em;  line-height: 130%; margin-bottom:10px;}
.txtbox2 .ul-wrap ul:nth-child(1){ margin-right:20px;}

.mapWrap  {width:100%;  }

@media screen and (max-width:1240px){ 

    #introduce .sec12 .txtbox {float:none;}
    #introduce .sec12 .txt-rt {text-align: center; margin-left:0;}
    
    #introduce .sec2 .wrap1400 {flex-direction: column;}
    #introduce .sec2 .txtbox, #introduce .sec2 .imgbox {width:100%; margin:20px 0 20px 0;}
    #introduce .sec2 .imgbox img {width:100%;}
    #introduce .sec3 .wrap1400 { flex-direction: column;}
    #introduce .sec3 .txtbox, #introduce .sec3 .imgbox{width:90%; margin:0 auto;}
    
    #introduce .sec3 .imgbox .mapWrap {width:100% !important;  }
.root_daum_roughmap .wrap_map {height:300px !important;}

}




/* 임플란트 */

#implant { }
#implant .subtit30 {margin-bottom:50px;}
#implant .sec1 {width:100%;  text-align: center;    }
#implant .sec1 .maintit40 { }
#implant .sec1 .secbg { display: flex; align-items: center; justify-content: center; height:580px; }
#implant .sec11 {background:url(../img/sub/sec21.png) center; }
#implant .sec12 { height:580px; background:url(../img/sub/sec22.png) center; }
#implant .sec12 .txtbox {float:left;}
#implant .sec13 { height:580px; background:url(../img/sub/sec23.png) center; }
#implant .sec14 { height:580px; background:url(../img/sub/sec24.png) center; }

#implant .sec2  {width:100%; text-align: left; height:900px; display: flex; align-items: center; }
#implant .sec2 .txtbox {margin-left:50px;}

@media screen and (max-width:1240px){ 
    #implant .sec2  { text-align: left; height: 100%; flex-direction: column-reverse;
    padding:50px 0 50px 0;}
    #implant .sec2 .imgbox {margin-top:50px;}
    #implant .sec2 .imgbox img {width:100%;}
    #implant .sec12 .txtbox {float:none;}
    #implant .sec12 .txt-rt {text-align: center; margin-left:0;}
    

}


/* 틀니치료 */

#dentures { }
#dentures .sectit {text-align: center; margin-bottom:50px; font-weight:600;}
#dentures .subtit30 { }
#dentures .sec1 {width:100%; height:940px;background:url(../img/sub/sec31.png) center; text-align: center; display: flex; align-items: center; flex-direction: column; justify-content: center;}
#dentures .sec1 .txtbox {margin-top:50px;}
#dentures .sec1 .tabbox { position: relative; margin-top:50px;}
#dentures .sec1 .tabbox .treatTab { color:#fff; font-size:2.1875em; text-align: center; margin:0 auto; width:1000px;} 
#dentures .sec1 .tabbox .treatTab:after {clear:both; content: ''; display:block;}
#dentures .sec1 .tabbox .treatTab li {float:left; margin:5px; width:calc(25% - 10px); height:90px; border-radius:45px; line-height:90px;}
#dentures .sec1 .tabbox .treatTab li:nth-child(odd) {background:#000355;}
#dentures .sec1 .tabbox .treatTab li:nth-child(even) {background:#31ade7;}
#dentures .sec1 .tabbox .txtbox {width:1400px; padding:100px 0 100px 0; background:#fff;}

#dentures .sec2 {width:100%; height:800px; background:#f6f6f6; text-align: left; display: flex; align-items: center; flex-direction: column; justify-content: center;}
#dentures .sec2 .sec2ul {width:1400px; margin:0 auto; display: flex; flex-wrap: wrap; }
#dentures .sec2 .sec2ul li {width:50%;  display: flex; align-items: center; align-items: center; margin-bottom:50px;}
#dentures .sec2 .sec2ul li .maintit40 {margin-bottom:20px;}
#dentures .sec2 .sec2ul li .imgbox {margin-right:20px; width:250px; height:130px; line-height: 130px; text-align: center;}

#dentures .sec3 { position: relative;}
#dentures .sec3 .sec-lt {}
#dentures .sec3 .secbg { display: flex; align-items: center; justify-content: center; height:580px; }
#dentures .sec3 .maintit40 {margin-bottom:50px; margin-top:50px;}
#dentures .sec31 {background:url(../img/sub/sec331.png) center; }
#dentures .sec32 {background:url(../img/sub/sec332.png) center; }
#dentures .sec33 { background:url(../img/sub/sec333.png) center; }
#dentures .sec3 .sec34 { height:850px !important; background:url(../img/sub/sec334.png) center; }
#dentures .sec34 .txtbox {text-align: center;}
#dentures .sec34 .txtbox .subtit20 { opacity: 0.5;}
#dentures .sec34 .ul-wrap {display: flex;   margin-bottom:10px;  justify-content: center;}
#dentures .sec34 ul:nth-child(1) { margin-right:20px; color:#000; }
#dentures .sec34 ul:nth-child(1) li {font-weight: 600;}
#dentures .sec34 ul li {color:#585858;   font-size:1.625em; line-height:150%; text-align:left; }


@media screen and (max-width:1240px){ 
    #dentures .sec1 .tabbox .treatTab {width:100%; left:0; margin-left:0; font-size: 1.678em;}
    #dentures .sec1 .tabbox .txtbox {width:100%; }
    #dentures .sec2 { height:100%; padding:50px 0 50px 0;}
    #dentures .sec2 .sec2ul {width:100%;  }
    

}

@media screen and (max-width:900px){ 
    #dentures .sec1 .tabbox .treatTab li {width :calc(50% - 10px)}
    #dentures .sec2 .sec2ul li {flex-direction: column; width:100%; justify-content: center; }
    #dentures .sec2 .sec2ul li .imgbox {width:30%;  height: 100%;}
    #dentures .sec2 .sec2ul li .imgbox img {width:100%;}
    #dentures .sec2 .sec2ul li .txtbox {text-align: center;}
    
    #dentures .sec3 .txt-rt {margin-left:0; float:none;}

}


#price { position: relative; background:#f5f5f5; padding:70px 0 70px 0;}
#price .wrap1400 { display: flex}
#price .pricewrap {width:50%; }
#price .pricewrap .titbox {text-align: center; margin-bottom:70px;}
#price .pricewrap .titbox .maintit40 { margin-bottom:70px; }
#price .pricewrap  .txtbox {display: flex;   margin-bottom:10px;  justify-content: center; flex-direction: column; align-items: center;}
#price .pricewrap .txtbox ul { display: flex; justify-content: space-around; align-items: center; width:50%; margin-bottom:30px;}
#price .pricewrap .txtbox ul li:nth-child(1)  {text-align:left;   }
#price .pricewrap .txtbox ul li:nth-child(2) {text-align:right; }


@media screen and (max-width:900px){    
    #price .wrap1400 { flex-direction: column;}
    #price .pricewrap {width:100%;}
    
}

/* 일반치료 */

#general { }
#general .sectit {text-align: center; margin-bottom:50px; font-weight:600;}
#general .subtit30 { opacity: 0.5; margin-top:30px;}
#general .sec1 {width:100%; height:1085px;background:url(../img/sub/sec41.png) #6eabbf bottom center no-repeat; display: flex; align-items: center; flex-direction: column; justify-content: center;}

#general .sec2 {width:100%; height:1085px; text-align: center; display: flex; align-items: center; flex-direction: column; justify-content: center;}

#general .sec3 {width:100%; height:1085px;background:url(../img/sub/sec43.png) center; text-align: center; display: flex; align-items: center; flex-direction: column; justify-content: center;}

#general .sec4 {width:100%;  text-align: center; display: flex; align-items: center; flex-direction: column; justify-content: center; padding:100px 0 100px 0;}
#general .sec4 .tabbox .txtboxul:after { display: none !important;}
#general .sec4 .tabbox .txtboxul .subtit25{ margin-top:30px;} 
#general .sec .titbox { text-align: center; }
#general .sec .tabbox { width:1400px; padding:50px 0 50px 0; background:#fff; display:flex; margin-top:50px; }
#general .sec .txtbox { width:100%;  display:flex; padding-top:30px; }
#general .sec .tabbox .txtboxul {width:25%; display: flex; flex-direction: column;  align-items: center; position:relative; text-align: center;}
#general .sec .tabbox .txtboxul .txtboximg {width:100%; height:250px; line-height: 250px; margin:30px 0 30px 0; text-align: center;}
#general .sec .tabbox .txtboxul .txtboxtit { margin-bottom:20px;}
#general .sec .tabbox .txtboxul:after { content: ''; background:url(../img/sub/arrow.png) no-repeat; display: inline-block; width:28px; height:45px; position: absolute; top:50%; right:0; }
#general .sec .tabbox .txtboxul:last-child:after {display: none;}

#general .sec .tabbox .txtboxul:nth-child(odd) .tabbtn {background:#000355;}
#general .sec .tabbox .txtboxul:nth-child(even) .tabbtn {background:#31ade7;}
#general .sec .tabbox .txtboxul .tabbtn { color:#fff; font-size:2.1875em; text-align: center;  width:calc(100% - 20px);  margin:0 auto; height:90px; border-radius:45px; line-height:90px; } 


@media screen and (max-width:1240px){ 
    #general .sec1 { height: 100%; padding:100px 0 100px 0; }
    #general .sec .tabbox {width:90%; padding:50px 0 50x 0; margin-top:50px;}
    #general .sec .txtbox  {flex-direction: row; flex-wrap: wrap;}
    #general .sec2 { height: 100%; padding:100px 0 100px 0;}
    #general .sec3 { height: 100%; padding:100px 0 100px 0;}
    #general .sec4 { height: 100%; padding:100px 0 100px 0;}
}


@media screen and (max-width:900px){ 
    #general .sec1 {background:#6eabbf;}
    #general .sec3 {background:#d56084;}
    #general .sec .tabbox .txtboxul {width:100%; margin:20px 0 20px 0;}
    #general .sec .tabbox .txtboxul .tabbtn {width: calc(70% - 20px); height:50px; line-height:50px;}
    #general .sec .tabbox .txtboxul:after {top:auto; bottom:-50px; right:auto; transform: rotate(90deg);}
    

}

/* 비급여수가표 */

.priceTable { width:100%; border-collapse: collapse; }
.priceTable tr {height:50px; line-height: 50px;}
.priceTable td {border:1px solid #999; font-size:1.25em; text-align: left; text-indent: 10px;}
.priceTable tr td:nth-child(1) {border-left:0;}
.priceTable tr td:last-child {border-right:0;}
.priceTable thead { border-top:2px solid #000; border-bottom:2px solid #000; text-align: center;}