@charset "utf-8";
/* CSS Document */
#novel-wrap > .head-wrap{width:calc(100% - 60px); max-width:1280px; margin: 0 auto; padding:8.75rem 0; background: url("/image/iclass/m3_background.png") top  no-repeat;}
#novel-wrap > .head-wrap .txt-wrap > h1{text-align: center; font-size:2.8125rem; font-weight: 600; color:#31323B;}
#novel-wrap > .stick{width:50px; height: 5px; background-color: #000; margin:0 auto;}
#novel-wrap > .section1-wrap{ padding:8.75rem 0;}
#novel-wrap > .section1-wrap > .inner-wrap{width:calc(100% - 60px); max-width:1280px; margin:0 auto; display:flex; justify-content: space-between; flex-wrap: wrap;}
#novel-wrap > .section1-wrap .box-wrap{width:calc(33% - 13px); max-width:378px;}
#novel-wrap > .section1-wrap .box-wrap .img-wrap{min-height: 104px; width:100%;}
#novel-wrap > .section1-wrap .box-wrap .img-wrap > img{margin:0 auto; display:block;}
#novel-wrap > .section1-wrap .box-wrap h1{color:#445CB4; font-size:1.5rem; font-weight: 700; font-family: 'Roboto', sans-serif; padding:15px 0; text-align: left; margin-top:20px;}
#novel-wrap > .section1-wrap .box-wrap p{font-size:1.125rem; line-height: 150%; font-family: 'Noto Sans KR', sans-serif;}


#novel-wrap > .section2-wrap{ padding:8.75rem 0; background-color:#EAEEF2; }
#novel-wrap > .section2-wrap > .inner-wrap{width:calc(100% - 60px); max-width:1280px; margin:0 auto;}
#novel-wrap > .section2-wrap .title-wrap > p.step{font-family: 'Roboto', sans-serif; color:#445CB4; font-weight: 700; text-align: center; }
#novel-wrap > .section2-wrap .title-wrap > h1{font-family: 'Roboto', sans-serif; color:#445CB4; font-weight: 700; text-align: center; font-size:5rem;}
#novel-wrap > .section2-wrap .title-wrap > h2{font-family: 'Noto Sans KR', sans-serif; font-size:2.8125rem; font-weight: 700; color:#000; text-align: center;}
#novel-wrap > .section2-wrap .title-wrap > p.ex{font-family: 'Noto Sans KR', sans-serif; font-size:1.25rem; color:#000; text-align: center;}
#novel-wrap > .section2-wrap .box-wrap{width:calc(100% - 40px); max-width:860px; padding:70px 20px 50px 20px; border-radius: 15px; background-color:#fff; position:relative; margin:0 auto; }
#novel-wrap > .section2-wrap .box-wrap:nth-child(2){margin-top:6.25rem;}
#novel-wrap > .section2-wrap .box-wrap > .step-wrap{position:absolute; top:-22px; left:50%; transform: translate(-50%,0); -webkit-transform: translate(-50%,0); width:150px; height: 44px; color:#fff; font-size:1.25rem; background-color:#445CB4; font-weight: 700; text-align: center; line-height:44px; font-family: 'Roboto', sans-serif; border-radius: 22px;}
#novel-wrap > .section2-wrap .box-wrap > h3{font-size:1.5rem; color:#31323B; font-weight:700; text-align: center; font-family: 'Noto Sans KR', sans-serif;}
#novel-wrap > .section2-wrap .box-wrap > p{font-size:1.125rem; font-family: 'Noto Sans KR', sans-serif; text-align:left; margin:20px auto 0 auto; line-height: 150%; max-width:577px; width:100%;}
#novel-wrap > .section2-wrap .hv{width:1px; height: 89px; margin:0 auto; background-image: url("/image/iclass/novel_dot_line.png");}


@media only screen and (max-width:768px){
    #novel-wrap > .section1-wrap .box-wrap h1{color:#445CB4; font-size:1.875rem; font-weight: 700; font-family: 'Roboto', sans-serif; padding:15px 0; text-align: center;}
    #novel-wrap > .section1-wrap .box-wrap p{font-size:1.125rem; line-height: 150%; font-family: 'Noto Sans KR', sans-serif;}
	#novel-wrap > .section1-wrap .box-wrap .img-wrap > img{max-width:75px;}
	#novel-wrap > .section1-wrap .box-wrap .img-wrap{min-height: 89px; width:100%;}
}

@media only screen and (max-width:640px){
	#novel-wrap > .section1-wrap > .inner-wrap{justify-content: center;}
	#novel-wrap > .section1-wrap .box-wrap{width:100%;  max-width:378px; margin-top:6.25rem;}
	#novel-wrap > .section1-wrap .box-wrap:nth-child(1){margin-top:0;}
	#novel-wrap > .section1-wrap .box-wrap .img-wrap{min-height:auto;}
}