/* 웹 */

/* 글 중제목 */

.middleTitle{
    width:100%;
    height:auto;
    margin:43px 0 0 0;
    line-height: 2em;
    word-break: keep-all;
    text-align: left;
    font-size:1.5em;
    color:#4a4a4a;
    font-weight: 700;
}

/* 중제목 두께 없이 */

.middleTitleLight{

    height:auto;
    margin:43px 0 0 0;
    line-height: 2em;
    word-break: keep-all;
    text-align: left;
    font-size:1.5em;
    color:#4a4a4a;
}


/* 소제목 */
.smallTitle{

    height:auto;
    margin: 25px 0 0 0;
    line-height: 2em;
    word-break: keep-all;
    text-align: left;
    font-size:1.3em;
    color:#4a4a4a;
    font-weight: 700;
}


/* 소제목 두께 없이 */

.smallTitleLight{

    height:auto;
    margin: 25px 0 0 0;
    line-height: 2em;
    word-break: keep-all;
    text-align: left;
    font-size:1.3em;
    color:#4a4a4a;
}

/* 더 작은 소제목 */
.moresmallTitle{

    height:auto;
    margin: 25px 0 0 0;
    line-height: 2em;
    word-break: keep-all;
    text-align: left;
    font-size:1.1em;
    color:#4a4a4a;
    font-weight: 700;
}







/* 본문 */

.textCon{
    width: 100%;
    height: auto;
    margin: 16px 0 0 0;
    color: #4a4a4a;
    font-size: 1.15em;
    line-height: 2em;
}

/* 각주,작은 글자 */
.textSmall{
    font-size: 16px;
}

/* 큰 글자 */
.bigtext{
    width:100%;
    height:auto;
    /* line-height: 2.3em; */
    font-size: 1.8em;
    color:#4a4a4a;
    font-weight: 800;
}



/* 오른쪽 정렬 연락처*/
.rightText{
    text-align:right;
}
.rightText>a{
    display:inline-block;
    color: #367bd4;
    text-align: justify;
    word-break: break-all;
}

/* 왼쪽 정렬 연락처 */

.telText{
    display: inline-block;
}

.telText>a{
    display:inline-block;
    color: #367bd4;
    text-align: justify;
    word-break: break-all;
}

/* 중앙정렬*/
.centertxt{
    text-align: center;
}

/* 이미지 */

.imgCon{
    width:100%;
    height:100%;
    margin: 43px 0 0 0;
    text-align:center;
}

.imgCon img{
    max-width:100%;
    height:auto;
}



/* 카카오링크제목 */
/* .linkTitle{
    width:100%;
    height:auto;
    margin:153px 0 0 0;
    line-height: 2em;
    word-break: keep-all;
    text-align: left;
    font-size:1.5em;
    color:#4a4a4a;
    font-weight: 700;
} */



.sectionBox{
    width:100%;
    height: auto;
    display: flex;
    flex-direction: column;
    justify-content:flex-start;
    align-items: center;
    word-break: keep-all;
    padding-bottom: 100px;
}

.textBox{
    padding-bottom: 60px;
}

/* 단락 나누기 */
.textBorder{
    width:100%;
    border-bottom:1px dashed #888;
    margin:30px 0 0 0;
}
.textBorderLine{
    width:100%;
    border-bottom:1px solid #888;
    margin:30px 0 0 0;
}

/* 플렉스 */
.flexCon{
    width:100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
}

.flexConLeft{
    width:100%;
    display: flex;
    /* justify-content:left; */
    flex-wrap: nowrap;
    align-items: flex-end;
}

.flexConSR{
    display: flex;
    justify-content: space-around;
    flex-wrap: nowrap;
}

.flexColumn{
    /* width:100%; */
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
}



/* 플랙스 425px 에서 가운데 정렬 */
.flex425Center{
    width:100%;
    display: flex;
    flex-wrap: nowrap;
}

/* 플랙스 반응형 없이 003 */
.flexConRow{
    width:100%;
    height:auto;
    display: flex;
    /* justify-content:left; */
    flex-wrap: nowrap;
    align-items: center;
}




/* 플렉스용 이미지(행정렬) */
.imgConFlex{
    max-width:100%;
    height:100%;
    text-align:center;
}
/* 플렉스용 이미지(행정렬) 반응형 */



/* 플렉스용 text */
.textFlex{
    padding:30px;
    width: 100%;
    height: auto;
    color: #4a4a4a;
    font-size: 1.15em;
    line-height: 2em;
}

.flexcalc{
    width:20%;
}



/* 플로트 */
.float{
    float: left;
    padding-right: 20px;
}


/* 유튜브비율 */
.videoWrap{
    width: 100%;
    max-width: 1200px;
}

.video {
    position: relative;
    width: 100%;
    height: auto;
    padding-top: 50%;
  }

  iframe {
    z-index: 1;
    top: 0;
    left: 0;
    position: absolute;
    width: 100%;
    height: 100%;
  }





/* 이전글 다음글 */

.flexConRow img{
    max-width: 100%;
}
 
.pre{
    float: left;
    font-size: 1.25em;
    font-weight: bold;
}

.nex{
    float: right;
    font-size: 1.25em;
    font-weight: bold;
}


/* playlist 이벤트 버튼 */
.box209{
    width:250px;
    height:50px;
    border-radius: 20px;
    background-color: rgb(112,87,163);
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    line-height: 50px;
    margin: 0 auto;
}

/* 제목박스 */
.titleBox{
    width:100%;
    height:50px;
    color:#fff;
    border-radius:5px;
    text-align:center;
    line-height: 50px;
}

.box209 a{
    color:#fff
}

/* .flexConRow img{
    max-width: 100%;
    height:30px;
} */

.colBox{
    width:100%;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
}
.col2{
    width: calc((100% - 10px) / 2);
    margin-top: 20px;
}
.col2 img{
    width:100%;
    display: block;
}
.col2 p{
    font-size:0.99rem;
    line-height: 1.6em;
    text-align: center;
}
.col3{
    width: calc((100% - 10px) / 3);
    margin-top: 20px;
}
.col3 img{
    width:100%;
    display: block;
}
.col3 p{
    font-size:0.99rem;
    line-height: 1.6em;
    text-align: center;
}
.subPageAreaHj .contentBoxHj .contentCenterHj .mainContentHj .titleUnderHj .col2 p strong{
    font-size:0.99rem;
    line-height: 1.6em;
}
.subPageAreaHj .contentBoxHj .contentCenterHj .mainContentHj .titleUnderHj .col3 p strong{
    font-size:0.99rem;
    line-height: 1.6em;
}

/* 박스하단선제목 */
.potoTitle{
    font-size: 1.5rem;
    height: 45px;
    line-height: 45px;
    /* padding: 10px 0; */
    box-sizing: border-box;
    margin-bottom: 15px;
    margin-top:60px;
    border-bottom: 3px solid rgb(240,131,0);
}
.potoTitle span{
    background-color: rgb(240,131,0);
    /* line-height: 45px; */
    padding: 5px 15px;
    box-sizing: border-box;
    border-radius: 10px 10px 0 0;
    color:white;
}

.potoTitle_2{
    font-size: 1.5rem;
    height: 45px;
    line-height: 45px;
    /* padding: 10px 0; */
    box-sizing: border-box;
    margin-bottom: 15px;
    margin-top:60px;
    border-bottom: 3px solid rgb(0,89,61);
}
.potoTitle_2 span{
    background-color: rgb(0,89,61);
    /* line-height: 45px; */
    padding: 5px 15px;
    box-sizing: border-box;
    border-radius: 10px 10px 0 0;
    color:white;
}

/* 하단선 제목 */
.borderTitle{
    border-bottom:1px solid #888;
}






.nanumH4Title{
    text-align: center;
    font-size: 2.2rem;
    margin-bottom: 30px;
    margin-top: 15px;
    width:100%;
}
.UlBox{
    box-sizing: border-box;
    padding-left: 30px;
    list-style: disc;
}
.strongNum{
    font-size: 1.5em;
    font-weight: 700;
}
.UlBox li{
    margin: 15px 0px;
}
.col2ImgBox{
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: stretch;
}
.colTxt p{
    font-size:1em;
    text-align: left;
}
.subPageAreaHj .contentBoxHj .contentCenterHj .mainContentHj .titleUnderHj .col2 .colTxt p strong{
    font-size:1em;
    text-align: left;
}
.colTxt .strongNum{
    font-size: 1.5em;
    font-weight: 700;
    text-align: left;
}
.col2ImgBox .colImg{
    width: 80px;
    display: flex;
    align-items: center;
}
.col2ImgBox .colImg img{
    width:100%;
    display: block;
}
.col2ImgBox .colTxt{
    width: calc(100% - 100px);
}

.contentBoxHj .contentCenterHj .imgW80{
    width:80%;
}
.contentBoxHj .contentCenterHj .mo304{
    display:none !important;
    width:100%
}


.width304{
    width:100%;
    display:block;
}

.width304 img{
    max-width:100%;
    height:auto;
    display:block;
    margin:0 auto;
}


.width304mo{
    width:100%;
    display:none;
}

.width304mo img{
    max-width:100%;
    height:auto;
    text-align: center;
}





/* 549호 002 텍스트박스 */
.box_549_002{
    
    display: flex;
    justify-content: space-between;
    padding: 10px;
    max-width: 1000px;
    margin:0 auto;
    box-sizing: border-box;
    color:#000
}


/* 글씨 양옆선 */
.sideLine{
    display: flex;
    flex-basis: 100%;
    align-items: center;
    font-size: 23px;
    margin: 15px 0
}

.sideLine::before, .sideLine::after{
    content: "";
    flex-grow: 1;
    background:#888;
    height:2px;
    width:100px;
    font-size: 0;
    line-height: 0;
    margin:0 15px;
}

/* 글씨 오른쪽선 */
.sideLineR{
    display: flex;
    flex-basis: 100%;
    align-items: center;
    font-size: 23px;
    margin: 15px 0
}

.sideLineR::after{
    content: "";
    flex-grow: 1;
    background:#888;
    height:2px;
    width:100px;
    font-size: 0;
    line-height: 0;
    margin:0 15px;
}


/* 사이드 둥근 박스선 */
.textBoxSideRound{
    border: 1px solid rgb(84,121,188);
    border-radius: 20px;
}

/* 왼위,오른아래 곡면 박스(551/201섹션)*/
.LTRDradiusBox{
    background-color:rgb(222,226,242);
    max-width: 100%;
    height:50px;
    border-top-left-radius:30px;
    border-bottom-right-radius: 30px;
    padding:10px;
    box-sizing: border-box;
    text-align: center;
}

/* 사진과 텍스트 왼쪽 사이 간격 20px */
.leftText-img{
    margin-left: 20px;
}





@media screen and (max-width: 960px) {
    .colBox{
    width:100%;
    display: flex;
    flex-flow: column nowrap;
    justify-content: start;
    }
    .col2{
        width: calc(100%);
        margin-top: 20px;
    }
    .col2 img{
        width:100%;
        display: block;
    }
    .col2 p{
        font-size:0.98em;
        line-height: 1.6em;
    }
    .col3{
        width: calc(100%);
        margin-top: 20px;
    }
    .col3 img{
        width:100%;
        display: block;
    }
    .col3 p{
        font-size:0.98em;
        line-height: 1.6em;
    }
    .subPageAreaHj .contentBoxHj .contentCenterHj .mainContentHj .titleUnderHj .col2 p strong{
        font-size:0.98em;
        line-height: 1.6em;
    }
    .subPageAreaHj .contentBoxHj .contentCenterHj .mainContentHj .titleUnderHj .col3 p strong{
        font-size:0.98em;
        line-height: 1.6em;
    }

    .flexConSR{
        display: block;
    }

    .imgW80{
        width:100%;
    }

}



/* 모바일 */

@media (max-width:960px) {

    .middleTitle{
        line-height: 3rem;
    }
    
    /* 본문 */
    
    .textCon{
        font-size: 1.15rem;
    }
    
    /* 이미지 */
    
    .imgCon{
        width:100%;
        height:100%;
    }
    
    .imgCon img{
        width:100%;
        height:auto;
        display: inline-block;
    }

    .flexCon{
        display: block;
    }

    .bigtext{
        line-height: 2em;
        font-size: 1.5em;
    }

    /* 플렉스용 text */
    .textFlex{
    padding:0;
    }
    .flexConLeft{
        display: block;
    }
    .leftText-img{
        margin-left: 0px;
    }
}



@media (max-width:536px) {
   
    /* 제목박스 */
    .titleBox{
        height:100px;
    }

    .float{
        float:none;
        padding-right: auto;
    }
    
}


@media (max-width:425px) {
    

    /* 제목박스 */
 

    .flex425Center{
        display: block;
        text-align: center;
    }
 
    
}

@media (max-width:320px) {
    .box_549_002{
        
        display: block;
       
    }
}