@charset "utf-8";
@import "./default.css";/*공통으로 사용될 css를 보관함*/

/* -START- sub_10_menu20_CSS*/
#menu20-chapter01 .ch01-section01{    
    float: left;
    width: 58%;
    padding-left: 18%;
}

.ch01-section01 .title01{
    padding-bottom: 50px;
    padding-top: 46px;
}

.ch01-section01 .title01 h2{
    font-size: 43px;
    font-family: 'paybooc-Bold';
    line-height: 70px;
    
}

.ch01-section01 .content01{
   padding-bottom: 126px;
}

.ch01-section01 .content01 p{
    font-size: 18px;
    font-weight: 500;
    line-height: 30px;
    
}

#menu20-chapter01 .ch01-section02{    
    float: right;
    width: 42%;
}

.ch01-section02 .content01{
    width: 70%;
    height: 540px;
    float: right;
    margin-right: 210px;    
}
.ch01-section02 img{
    width: 100%;
    padding-bottom: 91px;
}
.ch01-section02 .menu20_bg01{
    background-image: url("./img/menu20_bg01.png");
    background-repeat: no-repeat;
    background-size: cover;
    height: inherit;
    width: 100%;
    margin-bottom: 91px;
}
.ch01-section02 .sub-content01 p{
    font-size: 18px;
    font-weight: 500;
    line-height: 30px;    
}

.ch01-section02 .sub-content01 .sub-content01_txt{
    padding-top: 44px;
}

.ch01-section02 .sub-content01 .txt01{
    font-family: 'paybooc-Bold';
    font-size: 18px;    
    line-height: 48px;    
    padding-top: 44px;
}

.ch01-section02 .sub-content01 .txt02{
    font-family: 'paybooc-ExtraBold';
    font-size: 22px;   
    line-height: 48px;    
}

#menu20-chapter01 .ch01-section03{    
    padding-bottom: 133px;
    width: 80%;
}
.ch01-section03 .content01{    
    width: 70%;
}
.ch01-section03 .content01 img{    
    width: 100%;       
}
.ch01-section03 .content01 .menu20_bg02{    
    background-image: url("./img/menu20_bg02.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 603px;
    width: 100%;
    max-width: 995px;
    margin-bottom: 91px;    
    display: inline-block; 
}

#menu20-chapter02{
    width: 100%;        
    margin: 0 auto;
    height: 955px;
}

#menu20-chapter02 .ch02-section01{
    max-width: 1120px;
    border-top: 6px solid #30357B;
    margin: 0 auto;
    background: #FFFFFF 0% 0% no-repeat padding-box;
}

.ch02-section01 .sect01-content{
    width: 925px;    
    margin: 0 auto;
}

.ch02-section01 .sect01-content h2{
    /*font-family: 'paybooc-Bold';*/
    font-size: 35px;
    line-height: 48px;
    padding-top: 93px;
    padding-bottom: 65.5px;
}

.ch02-section01 .sect01-content ul{
    border-top: 1px solid #0F56BE;
    font-size: 20px;
    line-height: 90px;
    padding-bottom: 93.5px;
}

.ch02-section01 .sect01-content ul li{
    border-bottom: 0.75px solid #D1D1D1;

}

.ch02-section01 .sect01-content ul li > span:first-child{
    font-weight: 600;
    color: #30357B;
    width: 74px;
    display: inline-block;
}

.ch02-section01 .sect01-content ul li > span:last-child{    
    color: #6D6D6D;    
    display: inline-block;
    padding-left: 74px;
}

#menu20-chapter02 .ch02-section02{
    background: url('./img/menu20_bg03.png') no-repeat center / cover;
    height: 566px;
    position: relative;
    top: -280px;
    z-index: -1;
}

.pc-title{
    display: block;
}
.mobile-title{
    display: none;
}

@media (min-width:1024px){
    /*작은 네비 위치 강제로 맞춰줌*/
    .sub-header .com-02{   
        margin-right: 39px;
    }
}

@media (max-width: 1300px) {
	.container__wr_1200{padding: 0 20px;}
    .ch01-section02 .content01 {
        margin-right: 110px;
    }
    #menu20-chapter01 .ch01-section01 {       
        padding-left: 10%;
    }
}

@media (max-width: 1024px) {   
    #menu20-chapter01, #menu20-chapter02 .ch02-section01{
        padding-left: 20px;
        padding-right: 20px;
		margin-left:20px;
		margin-right: 20px;
    }
    
    
    #menu20-chapter01 .ch01-section01 {       
        padding-left: 0px;
        width: 100%;
        
    }
    .ch01-section01 .title01 {
        padding-bottom: 75px; 
        padding-top: 0px; 
    }
    .ch01-section01 .content01{
        padding-bottom: 75px;
    }
    .ch01-section01 .content01 p{
        line-height: 1.8em;
    }
    .ch01-section02 img {       
        height: 552px;
        padding-bottom: 75px;
    }
    .ch01-section02 .menu20_bg01{
        background-image: url("./tpl_img/t_menu20_bg01.png");
        height: 552px;
        margin-bottom: 75px;
    }

    #menu20-chapter01 .ch01-section02 {       
        width: 100%;
        float: left;
    }
    .ch01-section02 .content01 {
        margin-right: 0px;
        float: left;
        width: 100%;
        height: 552px;
    }
    
    #menu20-chapter02{
        
        display: inline-grid;
        align-content: center;
        position: relative;
    }

    #menu20-chapter01 .ch01-section03{           
        width: 100%;
    }

    .ch01-section03 .content01{    
        width: 100%;
        display: inline-block;        
        position: relative;
        top: 330px;
    }
    .ch01-section03 .content01 img{    
        width: 100%;       
    }

    .ch01-section03 .content01 .menu20_bg02{    
        background-image: url("./tpl_img/t_menu20_bg02.png"); 
        width: 100%;        
        margin-top: 100px;
    }

    .ch02-section01 .sect01-content{
       width: 100%;   
        margin: 0 auto;
    }

    #menu20-chapter02 .ch02-section02{
        background: url('./img/menu20_bg03.png') no-repeat center / cover;
        height: 727px;
    }

    #footer{
        margin-top: 260px;
    }
    
}

@media (max-width: 768px) {
    #menu20-chapter01, #menu20-chapter02 .ch02-section01{
        padding-left: 15px;
        padding-right: 15px;
    }
    .ch01-section01 .title01{
        padding-bottom: 39px;   
        padding-top: 0px;     
    }
    .ch01-section01 .title01 h2{
        font-size: 30px;
        line-height: 45px;        
    }    
    .ch01-section01 .content01 p{
        font-size: 15px;
        line-height: 25px;        
    }    
    .ch01-section01 .content01{
        padding-bottom: 40px;
    }
    .ch01-section02 img {       
        height: 257px;
        padding-bottom: 0px;
        margin-bottom: 40px;
    }
    .ch01-section02 .menu20_bg01{
        background-image: url("./m_img/m_menu20_bg01.png");
        height: 257px;
        padding-bottom: 0px;
        margin-bottom: 40px;
    }

    .ch01-section02 .sub-content01 p{
        font-size: 15px;
        line-height: 25px;
    }
    .ch01-section02 .sub-content01 .txt01{
        font-size: 15px;   
    }    
    .ch01-section02 .sub-content01 .txt02{
        font-size: 18px;   
    }
    .ch01-section03 .content01 .menu20_bg02{    
        background-image: url("./m_img/m_menu20_bg02.png"); 
        height: 239px;
        margin-top: 0px;
        margin-bottom: 0px;
    }

    #menu20-chapter02 .ch02-section01 {
        border-top: 5px solid #30357B;
    }
    #menu20-chapter01 .ch01-section03{    
        padding-bottom: 0px;       
    }

    .ch01-section03 .content01{
        top: 50px; 
    }

    #menu20-chapter02{
        
    }
    .ch02-section01 .sect01-content h2{        
        font-size: 20px;
        line-height: 19px;
        padding-top: 34px;
        padding-bottom: 34px;
    }
    .ch02-section01 .sect01-content ul{
        border-top: 1px solid #0F56BE;
        font-size: 15px;
        line-height: 1.3em;        
    }

    .ch02-section01 .sect01-content ul li > span{
        display: block;       
    }
    .ch02-section01 .sect01-content ul li > span:first-child{
        padding-top: 14px;
        padding-bottom: 7px;
        padding-left: 10px;
    }
    
    .ch02-section01 .sect01-content ul li > span:last-child{    
        padding-bottom: 14px;  
        display: block;
        padding-left: 10px;
    }
    .ch02-section01 .sect01-content ul{        
        padding-bottom: 50px;
    }
    #menu20-chapter02 .ch02-section02{
        background: url('./img/menu20_bg03.png') no-repeat center / cover;   
        height: 410px;
        position: initial;     
    }
    .pc-title{
        display: none;
    }
    .ch01-section01 .title01 h2.mobile-title{
        font-size: 28px;
        line-height: 1.6em;
        display: block;
    }

    #footer{
        margin-top: 0px;
    }
	.gap{display: none;}
}

@media (max-width: 500px) {
    .ch01-section02 .menu20_bg01{
        background-image: url("./m_img/500_menu20_bg01.png");        
    }   
    .ch01-section03 .content01 .menu20_bg02{    
        background-image: url("./m_img/500_menu20_bg02.png");
    }

    .ch01-section03 .content01{
        top: 50px; 
    }

    #menu20-chapter02{
        top: 51px;        
    }

    #footer{
        margin-top: 0px;
    }
}
/*// -END- sub_10_menu10_CSS*/



/* -START- sub_10_menu50_CSS*/

#menu50-chapter01 h2{    
    
    font-size: 35px;
    line-height: 48px;
    text-align: center;
    padding-bottom: 5px;
}

.section{
    width: 100%;
    padding-bottom: 36px;
    padding-top: 43px;
    display: inline-block;
    
}

.section div{
    float: left;
    border-top: 0.75px solid #d1d1d1;
    padding-top: 43px;
}

.section .part01{
    width: 25%;
    border-top: 2px solid #9F0000;
    font-size: 25px;
    font-weight: 600;
    line-height: 30px;
    color: #0F56BE;
}

.section .part01 span{    
    color: #9F0000;
    font-weight: 900;
}

.section .part02{
    width: 75%;  
    padding-top: 28px;  
}

.section .part02 span{
    font-size: 18px;    
    line-height: 56px;     
}

.section .part02 span:first-child{    
    font-weight: 600;    
    color: #000000;
}

.section .part02 span:nth-child(2){    
    color: #6D6D6D;
    padding-left: 19.85px;
}



@media (min-width:1024px){
    /*작은 네비 위치 강제로 맞춰줌*/
    .sub-header .com-02{   
        margin-right: 28px;
    }
}

@media (max-width: 1024px) {    
    .section {
        padding-left: 20px;
        padding-top: 38px;        
    } 
    .section .part02{
        width: 70%;
        padding-top: 32px;
    }

}

@media (max-width: 768px) {
    #menu50-chapter01 h2{ 
        font-size: 20px;
    }
    .section {
        padding-left: 15.5px;
        padding-right: 14.5px;
        padding-top: 36px;    
        padding-bottom: 22px;    
    } 
    .section .part01{
        width: 100%;
        padding: 20px 0px;
        text-align: center;
        font-size: 18px;   
        line-height: 18px;    
        
    }
    .section .part02{
        width: 100%;
        padding-top: 25px;
        
    }
    .section .part02 span{
        font-size: 15px;    
        line-height: 35px;     
    }

    .section .part02 span:nth-child(2) {
		line-height: 30px; letter-spacing: -1px;
    }
}
/*// -END- sub_10_menu50_CSS*/






