@charset "utf-8";
@import url( "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta2/css/all.min.css" );

/*font*/
@font-face {
     font-family: 'S-CoreDream-3Light';
     src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-3Light.woff') format('woff');
     font-weight: normal;
     font-style: normal;
}
@font-face {
     font-family: 'S-CoreDream-4Regular';
     src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-4Regular.woff') format('woff');
     font-weight: normal;
     font-style: normal;
}
@font-face {
     font-family: 'S-CoreDream-5Medium';
     src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-5Medium.woff') format('woff');
     font-weight: normal;
     font-style: normal;
}
@font-face {
     font-family: 'S-CoreDream-6Bold';
     src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-6Bold.woff') format('woff');
     font-weight: normal;
     font-style: normal;
}

/* reset.css */
html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, address, dl, dt, dd, ol, ul, li, fieldset, form, legend, table, caption, tbody, tfoot, thead, tr, th, td, input, select, textarea, button {margin:0; padding:0; font: 18px/2 'S-CoreDream-4Regular'; color:#111; box-sizing: border-box;}
body {background: #eee;}
h1, h2, h3, h4, h5, h6 {font-size:100%; background: none;}
img, fieldset {border:0; margin: 0; padding: 0; height: auto;}
table {border-collapse:collapse;}
ul, ol, li {list-style:none;}
address, em {font-style:normal;}
li img, object {vertical-align:top;}
input, select, textarea, form img {vertical-align:middle;}
input, select, textarea {border: 1px solid #333; border-radius: 5px;}
input:checked {outline:0;}
input:focus {outline:none;}
textarea:focus {outline:none;}
a {outline:0; text-decoration:none; border:none; color: #111;}
button {border: 0;}






/********************************************* 공통 *********************************************/

.mt3per{margin-top: 3%;}
.mt5per{margin-top: 5%;}
.mt0{margin-top: 0%;}
.mb5per{margin-bottom: 5%;}

.ico_new{width: 35px !important; margin: 0 0 0 1% !important; vertical-align: middle;}
.ico_re{width: 10px !important; height: 12px !important; margin: 0 1% 0 0 !important; vertical-align: middle; border-radius: 0 !important;}

/*layout*/
.headerWrap {width:100%;height:90px;}
#header {width:100%; height:90px; margin:0px auto; position:fixed; z-index: 950; top: 0; transition:all 0.5s; background: #eee;}

.contentsWrap{width: 100%; margin-top: 60px; display: block; transition: all 0.5s;}

.footerWrap {width:100%; margin-top: 100px; padding-bottom: 50px;  transition:all 0.5s; display: table;}
#footer {width:100%; margin:0px auto; transition:all 0.5s;}
#footer>li{text-align: center;}
#footer>li>a{font-size: 16px; color: #898989; line-height: 1; margin: 0 25px; display: inline-block;}
#footer>li.sns{padding: 10px 0;}
#footer>li.sns>a{font-size: 18px; margin: 0 15px;}
#footer>li.info{font-size: 12px; color: #aaa;}
#footer>li.info>span{margin: 0 5px; transition: all 0.5s;}
#footer>li.info>span+span{border-left: 1px solid #ddd; padding-left: 15px;}



/*header*/
#header h1 {position:absolute; left:50px; top:30px; transition:all 0.5s;}

.btnCall {position:absolute; top:40px; right:50px; display:block; transition:all 0.5s;}
.btnCall>.fa-align-right {font-size:40px; color:#333; transform:rotate(0deg); transition:all 0.5s;}
.btnCall>.fa-align-right:hover {transform:rotate(360deg);}
.btnCall>.fa-times {font-size:40px; color:#333; transform:rotate(0deg); transition:all 0.5s;}
.btnCall>.fa-times:hover {transform:rotate(360deg);}



/*gnb*/
.gnbMo {position:fixed; top:0px; right:-500px; width:500px; height:100%; background:#fff; z-index:999; transition:all 0.5s; box-sizing: border-box; padding: 40px 50px;}
.gnbMo.on {right:0px;}
#gnbMo>li>a {display:block; width:100%; font-size: 36px; line-height: 2.2; background: #fff;}
#gnbMo>li>ul>li>a {display:block; width:100%; line-height: 1.8; background: #fff;}
#gnbMo>li>ul{margin-bottom: 5%; margin-top: -2%;}
#gnbMo>li.btn{background: #fff; margin-bottom: 5%;}
#gnbMo>li.btn>a{width: 100px; height: 35px; line-height: 35px; text-align: center; background: #f4f4f4; color: #111; border-radius: 20px; font-size: 16px; vertical-align: middle; display: inline-block;}
#gnbMo>li.btn>a.close{width: 35px; background: none; font-size: 40px; line-height: 1; border-radius: 0; float: right;}
#gnbMo>li.btn>span{margin-bottom: 2%; display: block;}
#gnbMo>li.btn>span>div{margin: 10px 0; font-size: 14px; color: #898989;}
#gnbMo>li.btn>span>a{width: 100px; height: 35px; line-height: 35px; text-align: center; background: #f4f4f4; color: #111; border-radius: 20px; font-size: 16px; display: inline-block;}
#gnbMo>li.btn>span>a.logout{margin-left: 2%;}

/********************************************* 메인 *********************************************/

.mainConts{width: 600px; margin: 0 auto; position: relative; display: block;}

/*cover*/
#cover{width: 100%; height: 820px; transition:all 0.5s;}
#cover img{width: 100%; transition:all 0.5s; transform: translateX(0px) translateY(0px);}
#cover img:hover{box-shadow: 10px 10px 40px #3d3d3d; transition:all 0.5s; transform: translateX(-25px) translateY(-25px);}



/*quick menu*/
.quick{position: absolute; width: 70px; bottom: 0; left: 50%; margin-left: 325px;}
.quick>a{width: 70px; height: 70px; line-height: 78px; border-radius: 35px; color: #fff; box-sizing: border-box; padding: 0 17px; background: #333; display: block; transition:all 0.5s; position: relative;}
.quick>a+a{margin-top: 10px;}
.quick>a:hover{transition: all 0.5s;}
.quick>a>span{display: none; position: absolute; left: 60px; top: -2px;}
.quick>a:hover>span{display: block;}
.quick>a>i{font-size: 30px; width: 36px; height: 36px; line-height: 36px; text-align: center;}
.quick>a.q1:hover{background: #7865bd; width: 210px;}
.quick>a.q2:hover{background: #de991e; width: 230px;}
.quick>a.q3:hover{background: #f28b8c; width: 240px;}
.quick>a.q4:hover{background: #1cc5b3; width: 200px;}

/*220215 추가*/
.quick>a>span.pc{width: 70px; height: 70px; line-height: 73px; text-align: center; color: #fff; border-radius: 35px; display: block; left: 0; top: 0; font-size: 18px;}
.quick>a:hover>span.pc{display: none;}
.quick>a>i.fa-book-reader{display: none;}
.quick>a:hover>i.fa-book-reader{display: block; line-height: 70px;}


/********************************************* 서브 *********************************************/

/* sub common */
.subConts{width: 75%; margin: 0 auto; padding-top: 50px; display: block;}

.subConts h2{font-size: 48px; line-height: 1; background: url('/images/didache/img_sub_title.png') left bottom repeat-x; display: inline-block; padding-bottom: 3px; margin-bottom: 50px; transition: all 0.5s;}

.subConts h3{font-size: 30px; line-height: 1; border-left: 7px solid #f1d782; padding-left: 10px; margin-bottom: 25px; display: block;}

.conts{width: 100%; display: table; transition:all 0.5s;}
.bg_sub1{background: url('/images/didache/img_bubble.png') no-repeat; background-size: contain;}

/* 디다케소개 */
.didache{width: 100%; display: table;}
.didache>li{float: left; box-sizing: border-box; padding-top: 50px;}
.didache>li:nth-child(1){width: 35%; min-height: 250px; font: 30px 'S-CoreDream-6Bold'; padding-right: 5%; line-height: 1.2; transition: all 0.5s;}
.didache>li:nth-child(2){width: 65%; padding-left: 5%;}
.didache li span{display: block;}

/*rolling*/
.rolling_wrap {position: relative; width: 100%; height: 300px; margin-top: 50px; overflow: hidden;}
.rolling_wrap span {position: absolute; width: 200px; margin: 0 5px; overflow: hidden;}
.rolling_wrap span img {width: 100%; height: 100%;}

/*tab*/
.tabs{width: 100%; height: 70px; border-radius: 35px; background: #fafafa; }
.tabs>li{height: 70px; float: left; border-radius: 35px;}
.tabs>li>a{width: 100%; height: 100%; line-height: 70px; color: #898989; text-align: center; font-size: 24px; border-radius: 35px; display: block;}
.tabs>li>a.on{background: #111; color: #fff; font-family: 'S-CoreDream-6Bold';}
.tab2>li{width: 50%;}
.tab3>li{width: 33.3333%;}
.tab4>li{width: 25%;}
.tab_howto{width: 100%; margin-bottom: 5%; display: table; transition: all 0.5s;}
.tab_howto>li{float: left; width: 32.6666%; height: 70px; border-radius: 35px; background: #fafafa; margin-bottom: 1%;}
.tab_howto>li:nth-child(2){margin: 0 1%;}
.tab_howto>li:nth-child(5){margin: 0 1%;}
.tab_howto>li>a{width: 100%; height: 100px; line-height: 70px; color: #898989; text-align: center; font-size: 24px; border-radius: 35px; display: block;cursor:pointer;}
.tab_howto>li>a.on{background: #111; color: #fff; font-family: 'S-CoreDream-6Bold'; height: 70px;}

/*인사*/
.greet{width: 100%; padding: 3% 0; background-size: 520px; display: block;}
.greet>div{width: 60%;}
.greet>div>.sign{width: 100%; text-align: right; font-size: 24px; margin-top: 3%;}
.greet>div>.sign>span{font-size: 16px; color: #666;}
.jung{background: url(../img/jung.png) right top no-repeat;}
.lee{background: url(../img/lee.png) right top no-repeat;}

/*qna*/
.qna{width: 49.5%; list-style: none; margin: 0; padding: 0; float: left; margin-bottom: 2%;}
.qna+.qna{margin-left: 1%;}
.qna>li{box-sizing: border-box; border-radius: 30px; border: 1px solid #333;}
.qna input {display: none;}
.qna label { /* 제목 - 클릭 영역 */ width: 100%; text-align: center; font-family: 'S-CoreDream-6Bold'; padding: 10px 0; display: block;}
.qna label>i{margin-left: 10px;}
.qna>li>div { /* 내용 영역 - 기본 감춤 상태 */ display: none; overflow: hidden; padding: 3% 5%; box-sizing: border-box;}
.qna input:checked + label + div { /* 내용 영역 펼침 */ display: block;}
.qna div table{width: 100%;}
.qna div th{width: 20%; vertical-align: top;}
.qna2{width: 100%; list-style: none; padding: 0; margin-top: 3%; border-top: 2px solid #111;}
.qna2>li{border-bottom: 1px solid #ccc;}
.qna2 input {display: none;}
.qna2 label { /* 제목 - 클릭 영역 */ width: 100%; padding: 2%; display: block;}
.qna2>li>div { /* 내용 영역 - 기본 감춤 상태 */ display: none; overflow: hidden; box-sizing: border-box; padding: 2%; background: #f4f4f4;}
.qna2 input:checked + label + div { /* 내용 영역 펼침 */ display: block;}
.qna_other{margin-top: 2%; box-sizing: border-box; text-align: center;}


/*미사해설*/
.mass_week{display: table !important; margin-bottom: 2%; width: 100%; border: 0 !important; padding: 0 !important;}
.mass_week a{height: 100px; line-height: 100px; display: table;}
.mass_week a:nth-child(1){float: left; text-align: left;}
.mass_week a:nth-last-child(1){float: right; text-align: right;}
.mass_week div{width: 90%; margin: 0 auto; height: 100px; line-height: 1.6; font-size: 30px; text-align: center; display: table-cell !important; vertical-align: middle !important;}
.mass{width: 100%; margin-top: 5%; display: table;}
.mass li{float: left; display: block;}
.mass li:nth-child(1){width: 20%; font-family: 'S-CoreDream-6Bold';}
.mass li:nth-child(2){width: 80%;}
.mass li div{display: table;}
.mass li div+div{margin-top: 1.5%;}

/*이번호소개*/
.table_of_content{width: 100%; display: block;}
.table_of_content>div{float: left;}
.table_of_content>div+div{margin-left: 5%;}
.table_of_content>div>img{width: 100%;}
.table_of_content>div:nth-child(1){width: 50%;}
.table_of_content>div:nth-child(2){width: 45%;}
.table_of_content>div>a{width: 49%; height: 50px; line-height: 50px; box-sizing: border-box; padding: 0 20px;; border-radius: 25px; background: #111; color: #fff; text-align: center; display: inline-block;}
.table_of_content>div>a:nth-child(2){float: right;}
.table_of_content li{list-style:inside;}
.table_of_content li.subtxt{list-style:none; text-indent: 25px;}

/* 지난호보기 */
.last{width: 100%; display: table;}
.last a{width: 15%; float: left; margin-bottom: 3%;}
.last a+a{margin-left: 2%;}
.last a:nth-child(7){margin-left: 0;}
.last a:nth-child(13){margin-left: 0;}
.last a img{width: 100%;}
.last a span{width: 100%; text-align: center; display: block;}


/* 지난호보기 */
.last_wz{width: 100%; display: table; border:1px solid red;}
.last_wz a{width: 15%; float: left; margin-bottom: 3%;}
.last_wz a+a{margin-left: 1.9%;}
.last_wz a:nth-child(7){margin-left: 0;}
.last_wz a:nth-child(13){margin-left: 0;}
.last_wz a img{width: 220px !important;}
.last_wz a span{width: 100%; text-align: center; display: block;}


/* 디다케해저탐사대 */
 .expedition-list {width: 100%; display: table;}
 .expedition-list a{width: 15%; float: left; margin-bottom: 3%;}
 .expedition-list a+a{margin-left: 1.9%;}
 .expedition-list a:nth-child(7){margin-left: 0;}
 .expedition-list a:nth-child(13){margin-left: 0;}
 .expedition-list a img{width: 220px !important;}
 .expedition-list a span{width: 100%; text-align: center; display: block;}

/* 구독 유도 팝업*/
.modal-window-wrap {display:none;}
.modal-window-wrap.active {max-width: 350px;width:calc(100% - 40px);position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);display: flex;flex-direction: column;gap:20px;padding: 50px 30px 20px;background: #E1EFD8;border:2px solid #548135;}
.modal-window-wrap .close-button {width:18px;height:18px;background:url('/images/icon_close_111.png') no-repeat center / cover;position: absolute;right: 15px;top: 15px;}
.modal-window-wrap .text-box {display: flex;flex-direction: column;gap:15px;align-items:center;}
.modal-window-wrap .text-box  p {font-weight:500;font-size: 21px;}
.modal-window-wrap .text-box span {font-size:14px;}

/* 구독/영수증 */
.subscribe{width: 100%; text-align: center; padding-top: 3%;}
.subscribe>span{display: block;}
.subscribe>a{height: 70px; line-height: 70px; border-radius: 35px; background: #716f72; color: #fff; border: 0; text-align: center; margin: 10px auto 0 auto;display: block;}
.expiry_date{color: #ef3e46; margin-bottom: 1%;}

/* select search tag */
.searchWrap{margin-bottom: 3%; background: #fafafa; padding: 2%; border-radius: 10px; box-sizing: border-box; text-align: center; vertical-align: middle;}
.select {height: 50px; padding: 5px 30px 5px 10px; outline: 0 none; vertical-align: middle;}
.select option {background: #111; color: #fff;}
.search{width: 35%; height: 50px; border: 1px solid #333; border-radius: 5px; vertical-align: top; text-align: left; display: inline-block; background: #fff;}
.search input{width: 80%; height: 48px; line-height: 48px; padding: 0 10px; border: none; border-radius: 5px; vertical-align: middle;}
.search input:focus {outline:none;}
.search a{width: 48px; height: 48px; line-height: 48px; text-align: center; float: right;}
.hashtag{width: 100%; border-top: 1px solid #ddd; margin-top: 2%; padding-top: 1.5%; text-align: center; background: none; display: block;}
.hashtag a{margin: 0 0.5%; display: inline-block;}
.hashtag a:hover{text-decoration: underline;}

/* page */
.pageWrap{width: 100%; margin-top: 3%;}
#page{height: 50px; margin: 0 auto;}
#page th{width: 50px; height: 50px;}
#page th a{width: 50px; height: 50px; line-height: 50px; display: block;}
#page td{padding: 0 5px;}
#page td a{width: 50px; height: 50px; line-height: 50px; color: #898989; text-align: center; display: block;}
#page td a:hover{color: #111; font-family: 'S-CoreDream-6Bold';}
#page td a.on{background: #111; color: #fff; border-radius: 25px; font-family: 'S-CoreDream-6Bold';}
.mPage{display: none;}

/*list sort*/
.list_sort{width: 100%; text-align: right; font-size: 24px; transition: all 0.5s;}
.list_sort>a+a{margin-left: 5px;}

/*list*/
.list{width: 100%; border-top: 2px solid #111; display: table;}
.list li{width: 100%; border-bottom: 1px solid #ccc; display: table;}
.list li a{width: 100%; box-sizing: border-box; padding: 2%; display: table;}
.list li a:hover{background: #faf9f3;}
.list li span{display: table;}
.list li span.category{border-radius: 30px; background: #959498; color: #fff; padding: 0 20px; margin-bottom: 10px;}
.list li .title{width: 100%; line-height: 1.6;}
.list li .date{width: 20%; height: 100%; text-align: right; color: #898989; display: inline-block;}
.list li span.btn{width: 20%; height: 100%; text-align: right; display: inline-block;}
.list li span.btn>a{width: 100px; background: #716f72; color: #fff; text-align: center; border-radius: 30px; display: inline-block;}
.list img{width: 30%; border-radius: 10px; margin-right: 3%;}
.list ul{width: 67%; background: none; display: inline-block;}
.list ul>li{width: 100%; border: 0; background: none; display: table;}
.list ul>li>span{border-radius: 20px; padding: 0 15px; color: #fff; float: none; margin-bottom: 10px; display: inline-block;}
.list span.lv1{background: #2baeb1;}
.list span.lv2{background: #424173;}
.list span.lv3{background: #ff6e3f;}
.list span.bible{background: #e8577e;}
.list span.team{background: #ab5589;}
.list span.quiz{background: #566ebe;}
.list .subject{width: 100% !important; line-height: 1.6; display: block;}
.list .month{color: #898989;}
.list_reference a{width: 50% !important; float: left;}
.list_reference2 a{width: 100%; display: block;}
.list_reference2 a>div.title{width: 80%; display: inline-block;}
.list_reference2 a>div.title>span{color: #fff; border-radius: 30px; padding: 0 15px; line-height: 2; display: inline-block;}
.list_reference2 a>div.date{width: 20%; text-align: right; display: inline-block;}
/*--20211220추가*/
.list_subscribe{width: 100%; border-top: 2px solid #111;}
.list_subscribe th{height: auto; border-bottom: 1px solid #ccc; font-family: 'S-CoreDream-6Bold'; text-align: center; padding: 2%; box-sizing: border-box;}
.list_subscribe td{border-bottom: 1px solid #ccc; text-align: center; padding: 2%; box-sizing: border-box;}
.list_subscribe a.print{background: #716f72; color: #fff; text-align: center; padding: 2% 15px; border-radius: 5px; vertical-align: middle; display: inline-block;}
.list_subscribe button.cancel{background: #716f72; color: #fff; text-align: center; padding: 2% 15px; border-radius: 5px; vertical-align: middle; display: inline-block;}
.list_subscribe_m button.cancel{background: #716f72; color: #fff; text-align: center; padding: 1%; border-radius: 5px; vertical-align: middle; display: inline-block;font-size:14px;}
.list_subscribe_m{display: none;}
/*20211220추가--*/
.notice li span.title{width: 80%; padding-right: 3%; box-sizing: border-box; display: inline-block;}
.notice li.nothing{text-align: center; padding: 2%;}
.receipt li>span{padding: 2%; box-sizing: border-box;}
.receipt span.subject{width: 70% !important; display: inline-block;}
.receipt span.btn{width: 30% !important; text-align: right; display: inline-block;}
.receipt span.btn>a{background: #716f72; color: #fff; padding: 0 15px;}

/*view*/
.view{width: 100%; border-top: 2px solid #111; display: table;}
.view li{width: 100%; border-bottom: 1px solid #ccc; box-sizing: border-box; padding: 2%; display: table;}
.view li.subject div{width: 100%; line-height: 1.6; display: table;}
.view li.subject div+div{margin-top: 1%;}
.view li.subject .category{border-radius: 30px; background: #959498; color: #fff; padding: 0 20px; margin-bottom: 10px; line-height: 2;}
.view li.subject .title{width: 100%; font-size: 24px; line-height: 1.6;}
.view li.subject div:nth-child(2){color: #898989; text-align: right;}
.view li.subject div:nth-child(2) span{margin-left: 3%; font-family: 'S-CoreDream-3Light';}
.view li.subject div span{height: 100%; display: inline-block;}
.view li.file{border-bottom: 1px solid #eee;}
.view li.file a{color: #666; line-height: 1.2; display: block;}
.view li.file a+a{margin-top: 10px;}
.view li.file a:hover{color: #333; text-decoration: underline;}
.view li.file span.down{font-size: 12px; background: #716f72; color: #fff; text-align: center; border-radius: 30px; padding: 7px 15px 5px 15px; margin-left: 5px; display: inline-block;}
.view li.file a.down:hover{text-decoration: none;}
.view li.cont{padding: 50px 20px;}
.view li.cont div{margin-top: 2%;}
.view li.cont div img{width: 24%; margin-bottom: 10px;}
.view li.tag a{color: #666; margin-right: 1.5%;}
.view li.tag a:hover{text-decoration: underline;}
.view li.subject>div>span.lv1{background: #2baeb1;}
.view li.subject>div>span.lv2{background: #424173;}
.view li.subject>div>span.lv3{background: #ff6e3f;}
.view li.subject>div>span.bible{background: #e8577e;}
.view li.subject>div>span.team{background: #ab5589;}
.view li.subject>div>span.quiz{background: #566ebe;}
.view li.edit{text-align: right;}
.view li.edit>a{color: #898989;}
.view li.eidt>a>i{margin-left: 5px !important;}
.view li.edit>a+a{margin-left: 2%;}

/*write*/
.write{width: 100%; border-top: 2px solid #111;}
.write th{border-bottom: 1px solid #ccc; text-align: left; padding: 10px 20px; width: 20%;}
.write td{border-bottom: 1px solid #ccc; padding: 10px 20px;}
.write td select{border: 1px solid #959498;}
.write td input[type=text]{height: 50px; line-height: 50px; padding: 0 10px; border: 1px solid #959498;}
.write td input[type=password]{height: 50px; line-height: 50px; padding: 0 10px; border: 1px solid #959498;}
.write td input[type=file]{height: 50px; line-height: 50px; padding: 0 10px; border: 1px solid #959498;}
.write td textarea{height: 300px; padding: 10px; border: 1px solid #959498;}
.write td input{vertical-align: middle;}
.write td a{height: 50px; line-height: 50px; background: #716f72; color: #fff; text-align: center; padding: 0 20px; border-radius: 5px; vertical-align: middle; display: inline-block;}
.write td span{margin-right: 10px; display: inline-block;}
.write td div.btnWrap{width: 100%; margin-top: 3%; text-align: center; display: block;}
.write td div.btnWrap a{width: 150px; height: 50px; line-height: 50px; box-sizing: border-box; padding: 0 20px;; border-radius: 25px; background: #111; color: #fff; display: inline-block;}
.write td div.btnWrap a.move{width: auto; background: none; color: #111;}
.write_mobile{display: none;}
.write_mobile li div.btnWrap{width: 100%; margin-top: 3%; text-align: center; display: block;}
.write_mobile li div.btnWrap a{width: 150px; height: 50px; line-height: 50px; box-sizing: border-box; padding: 0 20px; border-radius: 25px; background: #111; color: #fff; display: inline-block;}
.write_mobile li div.btnWrap a.move{width: auto; background: none; color: #111;}

/*btn*/
.btnWrap{width: 100%; margin-top: 3%; text-align: center; display: block;}
.btnWrap a{width: 150px; height: 50px; line-height: 50px; box-sizing: border-box; padding: 0 20px;; border-radius: 25px; background: #111; color: #fff; display: inline-block;}
.btnWrap a.move{width: auto; background: none; color: #111; padding: 0 5px;}
.btnWrap a.move>i{margin: 0 5px;}

/*log*/
.login {width: 35%; height: 500px; margin: auto; transition: all 0.5s;}
.login h2 {font-size: 48px; letter-spacing:1px; text-align:center; font-family: 'S-CoreDream-6Bold'; display: block;}
.login input {width: 100%; height: 70px; line-height: 70px; margin-bottom: 2%; background: #eee; outline: none; padding: 0 30px; color: #111; border: 1px solid #ccc; border-radius: 35px; box-sizing: border-box;}
.login input:focus {background: #ccc;}
.login div{text-align: center; margin-top: 3%;}
.login div a{font-size: 16px; color: #898989; font-family: 'S-CoreDream-3Light';}
.login div span{margin: 0 1%; display: inline-block; line-height: 1;}
.login div span:nth-child(2){border-left: 1px solid #ccc; padding-left: 3%;}
.btn_login{width: 100%; height: 70px; line-height: 70px; border-radius: 35px; background: #111; color: #fff; border: 0; text-align: center; display: block;}

/*find*/
.find {width: 50%; height: 350px; margin:50px auto 0 auto; transition: all 0.5s;}
.find input {width: 100%; height: 70px; line-height: 70px; margin-bottom: 2%; background: #eee; outline: none; padding: 0 30px; color: #111; border: 1px solid #ccc; border-radius: 35px;}
.find input:focus {background: #ccc;}
.btn_find{width: 100%; height: 70px; line-height: 70px; border-radius: 35px; background: #716f72; color: #fff; border: 0; text-align: center; display: block;}

/*join*/
.step1{width: 100%; border-radius: 15px; background: #f4f4f4; padding: 4%; display: block;}
.step1 div{width: 100%; height: 500px; background: #f4f4f4; overflow-y: auto;}
.step3{width: 100%; border-radius: 15px; background: #f4f4f4; box-sizing: border-box; padding: 50px; text-align: center;}
.step3 div{background: none;}
.step3 div:nth-child(1){font-size: 24px; font-family: 'S-CoreDream-6Bold';}
.step3 div span{color: #c62127;}
.step3 a{width: 200px; height: 50px; line-height: 50px; border-radius: 25px; text-align: center; background: #111; color: #fff; text-align: center; margin-top: 2%; display: inline-block;}
.church{width: 500px; display: block;}
.church>li{padding: 10px; box-sizing: border-box; text-align: center; transition: all 0.5s;}
.church>li:nth-child(1){background: #111; color: #fff; text-align: left; font-family: 'S-CoreDream-6Bold';}
.church>li:nth-last-child(1){border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; height: 200px; overflow-y: auto;}
.church>li>input{padding: 0 10px !important;}
.church>li>a.btn{height: 40px; line-height: 40px; background: #716f72; color: #fff; padding: 0 15px; border-radius: 5px; vertical-align: middle;display: inline-block;}
.church>li>a.btn:hover{background: #716f72;}
.church>li>a{text-align: left; padding: 0 10px; display: block;}
.church>li>a:hover{background: #f4f4f4;}
.church>li>a>span{width: 100px; display: inline-block;}

/*mypage*/
.mypage{width: 100%; margin-bottom: 3%;}
.mypage>li{width: 33.3333%;}
.serial{text-align: center; padding-top: 50px;}
.serial>input{width: 50%; height: 70px; line-height: 70px; padding: 0 30px; border-radius: 35px;}
.serial>a{width: 50%; height: 70px; line-height: 70px; border-radius: 35px; background: #716f72; color: #fff; border: 0; text-align: center; margin: 10px auto 0 auto;display: block;}
.mypage_del_title{font-weight:800; font-size: 18px; margin-bottom: 0.1%;}
.mypage_del_memo{padding-left:22px;}

/*정책*/
.email_reject{width: 100%; display: block;}
.email_reject>.noti{text-align: center; background: #f4f4f4; border-radius: 10px; padding: 50px; box-sizing: border-box;}
.email_reject>.noti>i{font-size: 48px;}
.email_reject>.rule{margin-top: 50px;}
.email_reject>.rule>li{list-style: inside;}
.email_reject>.rule>li:nth-child(1){font-family: 'S-CoreDream-6Bold'; list-style: none;}
.email_reject>.rule>li:nth-last-child(1){list-style: none;}
.privacy{width: 100%; display: block;}
.privacy>li+li{margin-top: 2%;}
.privacy>li div{padding-left: 25px; display: block;}

/*웹진이용방법*/
.howto{width: 100%;}
.howto li+li{margin-top: 10%; padding-top: 10%; border-top: 1px solid #ddd;}
.howto li{text-align: center; display: block;}
.howto p{font-size: 24px;}
.howto p.important{color: #ef3e46;}
.howto p a:hover{text-decoration: underline;}
.howto strong.important{color: #ef3e46;}
.howto img{margin-top: 2%;}
/*--220217추가*/
.howto02_notice{text-align: left; margin: 0 auto; display: block; width: 74%; margin-top: 2%; padding-top: 2%; border-top: 1px dashed #ddd;}
.howto02_notice>p{text-align: left;}
.howto02_notice>p>span{color: #ef3e46;}
.howto table{width: 72%; margin: 2% auto 0 auto;}
.howto th{border: 1px solid #ccc; background: #f4f4f4; padding: 1.5%; box-sizing: border-box; font-weight: bold;}
.howto td{border: 1px solid #ccc; padding: 1.5%; box-sizing: border-box;}
.howto tr:nth-child(5)>td{border-right: 0;}
/*220217추가--*/
.howto01_notice{border: 3px solid #ef3e46 !important; border-radius: 35px; box-sizing: border-box; padding: 5% !important; background: #fff; transition: all 0.5s;}
.howto01_notice>div{font-size: 36px; font-family: 'S-CoreDream-6Bold'; color: #ef3e46; margin-bottom: 2%;}
.howto01_notice>ul>li{text-align: left; font-size: 24px; line-height: 1.6; position: relative; padding-left: 20px;}
.howto01_notice>ul>li::before{font-family:"Font Awesome 5 Free"; content: "\f105"; font-weight: 900; position: absolute; left: 0;}
.howto01_notice>ul>li+li{margin-top: 1.5%; border: none !important; padding-top: 0;}
.howto01_notice>ul>li>span{display: block; padding-left: 15px;}
.howto01_logout{font-size: 36px; margin-top: 2% !important; border: none !important; padding: 0 !important;}
.howto01_logout strong{color: #ef3e46;}
.howto02_notice{text-align: center; font-size: 48px; margin-bottom: 5%;}
.howto02_notice>strong{color: #ef3e46;}
.howto > li {display:none;} 
.howto > li.active {display:block;}











/*----------------------------------------------------------------------------------------------------
                                              반응형
----------------------------------------------------------------------------------------------------*/



@media screen and (max-width:1300px) {

    /********************************************* 공통 *********************************************/

	/*layout*/
    #header {height:90px; /*background: yellow;*/}

    .contentsWrap{margin-top: 130px;}

    .footerWrap {margin-top: 80px; padding-bottom: 40px;}



    /*header*/
    #header h1 {left:35px; top:25px;}

    .btnCall {top:35px; right:35px;}



    /******************************************* 메인1300 *******************************************/

    /*cover*/
    #cover img:hover{box-shadow: 10px 10px 25px #3d3d3d; transform: translateX(-20px) translateY(-20px);}



    /******************************************* 서브1300 *******************************************/

    /* sub common */
    .subConts{width: 80%; padding-top: 40px;}

    .subConts h2{font-size: 42px; margin-bottom: 40px;}

    .subConts h3{font-size: 26px;}

    /* 디다케소개 */
    .didache>li{padding-top: 40px;}

    /*rolling*/
    .rolling_wrap {height: 250px; margin-top: 40px;}
    .rolling_wrap span {width: 180px;}

    /*인사*/
    .greet{background-size: 450px;}
    .greet>div{width: 59%;}

    /* 지난호보기 */
    .last a{width: 18.4%;}
    .last a+a{margin-left: 2%;}
    .last a:nth-child(6){margin-left: 0;}
    .last a:nth-child(7){margin-left: 2%;}
    .last a:nth-child(11){margin-left: 0;}
    .last a:nth-child(13){margin-left: 2%;}
    .last a:nth-child(16){margin-left: 0;}
    .last a img{width: 100%;}
    .last a span{width: 100%; text-align: center; margin-top: 10px; display: block;}

    /*list*/
    /*--20211220추가*/
    .list_subscribe a.print{font-size: 16px; letter-spacing: -1.5px;}
    /*20211220추가--*/

    /*view*/
    .view li.cont .scroll_x a{width: 20%;}

    /*log*/
    .login {width: 45%; padding-top: 50px;}

    /*이용안내*/
    .howto02_notice{font-size: 42px;}

    /*tab*/
    .tab4>li:nth-child(1)>a{line-height: 1.4;}
    .tab4>li:nth-child(1)>a>span{display: block;}
    }





@media screen and (max-width:1024px) {

    /********************************************* 공통 *********************************************/

	/*layout*/
    #header {height:75px; /*background: lightblue;*/}

    .contentsWrap{margin-top: 105px;}

    .footerWrap {margin-top: 60px; padding-bottom: 30px;}
    #footer>li>a{font-size: 14px; margin: 0 15px; }
    #footer>li.sns{padding: 5px 0;}
    #footer>li.sns>a{font-size: 16px; margin: 0 10px;}
    #footer>li.info{font-size: 11px;}



    /*header*/
    #header h1 {left:20px; top:20px;}
    #header h1 img{height: 50px;}

    .btnCall {top:30px; right:20px;}
    .btnCall>.fa-align-right {font-size:32px;}
    #gnbMo>li.btn>a.close>.fa-times{position: absolute; top: 0; right: 0px;}



    /*gnb*/
    .gnbMo {right:-450px; width:450px;}
    #gnbMo>li>a {font-size: 32px;}
    #gnbMo>li>ul>li>a {font-size: 16px;}
    #gnbMo>li.btn>a{font-size: 14px;}
    #gnbMo>li.btn>a.close{font-size: 35px;}
    #gnbMo>li.btn>span>a{font-size: 14px;}
    #gnbMo>li.btn>span>div{font-size: 12px;}



    /******************************************* 메인1024 *******************************************/

    /*cover*/
    #cover{height: 100%; display: table;}
    #cover img:hover{box-shadow: 10px 10px 15px #3d3d3d; transform: translateX(0px) translateY(-15px);}



    /*quick menu*/
    .quick{position: static; width: 100%; left: 0; margin-left: 0; margin-top: 10px; display: table;}
    .quick>a{width: 100%; line-height: 70px; float: left; text-align: center;}
    .quick>a:hover{width: 100%;}
    /*.quick>a:nth-child(2n){margin-left: 2%;}*/
    .quick>a+a{margin-top: 2%;}
    .quick>a>span{display: inline-block; vertical-align: middle; position: static;}
    .quick>a:hover>span{display: inline-block; vertical-align: middle;}
    .quick>a>i{vertical-align: middle;}
    .quick>a.q1{background: #7865bd;}
    .quick>a.q2{background: #de991e;}
    .quick>a.q3{background: #f28b8c;}
    .quick>a.q4{background: #1cc5b3;}
    .quick>a.q1:hover{width: 100%;}
    .quick>a.q2:hover{width: 100%;}
    .quick>a.q3:hover{width: 100%;}
    .quick>a.q4:hover{width: 100%;}

    /*220215 추가*/
    .quick>a>span.pc{display: none;}
    .quick>a:hover>span.pc{display: none;}
    .quick>a>i.fa-book-reader{display: inline-block;}
    .quick>a:hover>i.fa-book-reader{display: inline-block; line-height:36px;}




    /******************************************* 서브1024 *******************************************/

    /* sub common */
    .subConts{width: 90%; padding-top: 30px;}

    .subConts h2{font-size: 36px; background: url('/images/didache/img_sub_title2.png') left bottom repeat-x; margin-bottom: 30px;}

    .subConts h3{font-size: 24px; border-left: 5px solid #f1d782; margin-bottom: 20px;}

    /* 디다케소개 */
    .didache>li{padding-top: 30px;}
    .didache>li:nth-child(1){font: 24px 'S-CoreDream-6Bold';}
    .didache>li:nth-child(2){font-size: 16px;}

    /*rolling*/
    .rolling_wrap {height: 210px; margin-top: 40px;}
    .rolling_wrap span {width: 150px;}

    /*tab*/
    .tabs{height: 50px; margin-bottom: 5%;}
    .tabs>li{height: 50px;}
    .tabs>li>a{line-height: 50px; font-size: 20px;}
    .tab_howto{width: 100%; margin-bottom: 5%; display: table;}
    .tab_howto>li{height: 50px;}
    .tab_howto>li>a{line-height: 50px; font-size: 20px;}
    .tab_howto>li>a.on{height: 50px;}
    .tab4>li:nth-child(1)>a{line-height: 1.2; padding-top: 1%;}

    /*인사*/
    .greet{background-size: 350px;}
    .greet>div>p{font-size: 16px;}
    .greet>div>.sign{font-size: 20px;}
    .greet>div>.sign>span{font-size: 14px;}

    /*qna*/
    .qna{width: 100%;}
    .qna>li{border-radius: 10px;}
    .qna+.qna{margin-left: 0;}
    .qna label {padding: 7px 0; font-size: 16px;}
    .qna div th{width: 25%; font-size: 16px;}
    .qna div td{font-size: 16px;}
    .qna2{margin-top: 5%;}
    .qna2 label {font-size: 16px;}
    .qna2>li>div {font-size: 16px;}

    /*미사해설*/
    .mass_week a{height: 80px; line-height: 80px; font-size: 24px;}
    .mass_week div{height: 80px; font-size: 24px;}
    .mass li{float: none; font-size: 16px;}
    .mass li:nth-child(1){width: 100%;}
    .mass li:nth-child(2){width: 100%;}
    .mass li div{font-size: 16px;}

    /*이번호소개*/
    .table_of_content>div:nth-child(1){width: 45%;}
    .table_of_content>div:nth-child(2){width: 50%;}
    .table_of_content>div>a{height: 40px; line-height: 40px; font-size: 16px;}
    .table_of_content li{font-size: 16px;}

    /* 지난호보기 */
    .last a{width: 23.5%; font-size: 16px;}
    .last a+a{margin-left: 2%;}
    .last a:nth-child(5){margin-left: 0;}
    .last a:nth-child(6){margin-left: 2%;}
    .last a:nth-child(7){margin-left: 2%;}
    .last a:nth-child(9){margin-left: 0;}
    .last a:nth-child(11){margin-left: 2%;}
    .last a:nth-child(13){margin-left: 0;}
    .last a:nth-child(16){margin-left: 2%;}
    .last a:nth-child(17){margin-left: 0;}
    .last a img{width: 100%;}
    .last a span{width: 100%; text-align: center; display: block;}

    /* 구독/영수증 */
    .subscribe{font-size: 16px;}
    .subscribe>a{height: 50px; line-height: 50px;}
    .expiry_date{font-size: 16px;}

    /* select search tag */
    .select {height: 40px; padding: 5px 20px 5px 10px; font-size: 16px;}
    .search{/*width: auto;*/ height: 40px; font-size: 16px;}
    .search input{height: 38px; line-height: 38px; font-size: 16px;}
    .search a{width: 38px; height: 38px; line-height: 38px;}
    .hashtag a{font-size: 16px;}

    /* page */
    #page{height: 40px;}
    #page th{width: 40px; height: 40px;}
    #page th a{width: 40px; height: 40px; line-height: 40px; font-size: 16px;}
    #page td a{width: 40px; height: 40px; line-height: 40px; font-size: 16px;}

    /*list sort*/
    .list_sort{font-size: 21px;}

    /*list*/
    .list li a{font-size: 16px;}
    .list ul>li>span{font-size: 16px;}
    .list ul>li>span.bible{background: #e8577e; letter-spacing: -1.5px;}
    .list .subject{font-size: 16px;}
    .list .month{font-size: 16px;}
    /*--20211220추가*/
    .list_subscribe th{font-size: 16px;}
    .list_subscribe td{font-size: 16px; padding: 2% 1%;}
    .list_subscribe td>a.print{font-size: 14.5px; letter-spacing: -1px; padding: 2% 10px;}
    /*20211220추가--*/
    .list_reference2 a>div.title{font-size: 16px;}
    .list_reference2 a>div.date{font-size: 16px;}
    .notice li.nothing{font-size: 16px;}

    /*view*/
    .view li.subject .category{font-size: 16px;}
    .view li.subject .title{font-size: 21px;}
    .view li.subject div:nth-child(2){font-size: 16px; transition: all 0.5s;}
    .view li.file a{font-size: 16px; transition: all 0.5s;}
    .view li.cont{font-size: 16px; transition: all 0.5s;}
    .view li.cont .scroll_x a{width: 25%;}
    .view li.tag a{font-size: 16px;}
    .view li.edit>a{font-size: 16px;}

    /*write*/
    .write th{font-size: 16px;}
    .write td{font-size: 16px;}
    .write td input[type=text]{height: 40px; line-height: 40px;}
    .write td input[type=password]{height: 40px; line-height: 40px;}
    .write td input[type=file]{height: 40px; line-height: 40px; font-size: 16px;}
    .write td textarea{font-size: 16px;}
    .write td a{height: 40px; line-height: 40px; font-size: 16px;}
    .write td span{margin-right: 10px;display: inline-block;}

    /*btn*/
    .btnWrap a{width: 130px; height: 40px; line-height: 40px; padding: 0 15px; font-size: 16px; transition: all 0.5s;}

    /*log*/
    .login {width: 50%; padding-top: 100px;}
    .login h2 {font-size: 42px;}
    .login input {height: 50px; line-height: 50px; font-size: 16px;}
    .login div a{font-size: 14px;}
    .btn_login{height: 50px; line-height: 50px; font-size: 16px;}

    /*find*/
    .find {width: 70%;}
    .find input {height: 50px; line-height: 50px; font-size: 16px;}
    .btn_find{height: 50px; line-height: 50px; font-size: 16px;}

    /*join*/
    .step1 div{font-size: 16px;}
    .step3 div{font-size: 16px;}
    .step3 div:nth-child(1){font-size: 21px;}
    .step3 a{width: 200px; height: 40px; line-height: 40px; font-size: 16px;}
    .church>li{font-size: 16px;}
    .church>li>a.btn{font-size: 16px;}
    .church>li>a{font-size: 16px;}

    /*mypage*/
    .serial{padding-top: 0;}
    .serial>input{height: 50px; line-height: 50px; font-size: 16px;}
    .serial>a{height: 50px; line-height: 50px; font-size: 16px;}

    /*정책*/
    .email_reject>.noti{padding: 5%; font-size: 16px;}
    .email_reject>.noti>i{font-size: 36px;}
    .email_reject>.rule{margin-top: 5%;}
    .email_reject>.rule>li{font-size: 16px;}
    .privacy>li{font-size: 16px;}
    .privacy>li div{font-size: 16px; padding-left: 20px;}

    /*웹진이용방법*/
    .howto p{font-size: 21px;}
    .howto img{width: 80%; margin-bottom: 3%;}
    .howto01_notice>div{font-size: 24px;}
    .howto01_notice>ul>li{font-size: 21px;}
    .howto01_logout{font-size: 30px;}
    .howto02_notice{font-size: 36px;}
    }

@media screen and (max-width:760px) {

    /********************************************* 공통 *********************************************/

    /*layout*/
    #header {height:60px; /*background: pink;*/}

    .contentsWrap{margin-top: 70px;}

    .footerWrap {margin-top: 40px; padding-bottom: 20px;}
    #footer>li>a{font-size: 12px;}
    #footer>li.sns{padding: 0;}
    #footer>li.sns>a{font-size: 14px; margin: 0 10px;}
    #footer>li.info{font-size: 10px;}



    /*header*/
    #header h1 {left:10px; top:10px;}
    #header h1 img{height: 45px;}

    .btnCall {top:20px; right:10px;}
    .btnCall>.fa-align-right {font-size:24px;}



    /*gnb*/
    .gnbMo {right:-85%; width:85%; padding: 20px 25px;}
    #gnbMo>li>a {font-size: 24px;}
    #gnbMo>li>ul>li>a {font-size: 14px;}
    #gnbMo>li.btn>a{width: 80px; height: 30px; line-height: 30px; font-size: 12px;}
    #gnbMo>li.btn>a.close{width: 25px;}
    #gnbMo>li.btn>a.close>.fa-times{font-size: 24px; position: absolute; top: 0; right: 0;}
    #gnbMo>li.btn>span>a{width: 80px; height: 30px; line-height: 30px; font-size: 12px;}



    /******************************************* 메인760 *******************************************/

    .mainConts{width: 100%; box-sizing: border-box; padding: 0 10px;}

    /*cover*/
    #cover{height: 100%; display: table;}
    #cover img:hover{box-shadow: none; transform: translateX(0px) translateY(0px);}



    /*quick menu*/
    .quick{position: static; width: 100%; height: 110px; left: 0; margin-left: 0; margin-top: 10px;}
    .quick>a{width: 100%; height: 50px; line-height: 50px; float: left; margin-bottom: 1%; text-align: center;}
    .quick>a:nth-child(2n){margin-left: 0;}
    .quick>a+a{margin-top: 0;}
    .quick>a>span{display: inline-block; position: static; font-size: 16px; vertical-align: middle;}
    .quick>a:hover>span{display: inline-block;}
    .quick>a>i{font-size: 24px; width: 30px; height: 24px; line-height: 24px; margin-right: 5px; vertical-align: middle;}
    .quick>a.q1{background: #7865bd;}
    .quick>a.q2{background: #de991e;}
    .quick>a.q3{background: #f28b8c;}
    .quick>a.q4{background: #1cc5b3;}
    .quick>a.q1:hover{width: 100%;}
    .quick>a.q2:hover{width: 100%;}
    .quick>a.q3:hover{width: 100%;}
    .quick>a.q4:hover{width: 100%;}

    /*220215 추가*/
    .quick>a>span.pc{display: none;}
    .quick>a:hover>span.pc{display: none;}
    .quick>a>i.fa-book-reader{display: inline-block;}
    .quick>a:hover>i.fa-book-reader{display: inline-block; line-height: normal;}



    /******************************************* 서브760 *******************************************/

    /* sub common */
    .subConts{width: 100%; padding: 20px 10px; box-sizing: border-box;}

    .subConts h2{font-size: 30px; background: url('/images/didache/img_sub_title2.png') left bottom repeat-x; margin-bottom: 20px;}

    .subConts h3{font-size: 21px; margin-bottom: 15px;}

    .bg_sub1{background: url('/images/didache/img_bubble2.png') no-repeat; background-size: cover; transition: all 0.5s;}

    /* 디다케소개 */
    .didache>li{float: none; padding-top: 0;}
    .didache>li:nth-child(1){font: 24px 'S-CoreDream-6Bold'; width: 100%; min-height: auto; padding-right: 0; padding-bottom: 5%;}
    .didache>li:nth-child(1)>span{display: inline-block;}
    .didache>li:nth-child(2){font-size: 14px; width: 100%; padding-left: 0;}

    /*rolling*/
    .rolling_wrap {height: 170px; margin-top: 30px;}
    .rolling_wrap span {width: 120px;}

    /*tab*/
    .tabs>li>a{font-size: 16px;}
    .tab_howto>li{width: 49.5%;}
    .tab_howto>li:nth-child(2){margin: 0 0 1% 0;}
    .tab_howto>li:nth-child(5){margin: 0 0 1% 0;}
    .tab_howto>li:nth-child(2n){margin-left: 1%;}
    .tab_howto>li>a{font-size: 16px;}
    .tab4>li:nth-child(1)>a{padding: 4px 1%; line-height: 1.4; box-sizing: border-box;}
    .tab4>li:nth-child(1)>a>span{letter-spacing: -2px;}
    .tab4>li:nth-child(2)>a{padding: 4px 1%; line-height: 1.4; box-sizing: border-box;}
    .tab4>li>a>span{display: block;}


    /*인사*/
    .greet>div{width: 100%; margin-top: 280px;}
    .greet>div>p{font-size: 14px;}
    .greet>div>.sign{font-size: 16px;}
    .greet>div>.sign>span{font-size: 12px;}
    .jung{background: url(../img/jung.png) top center no-repeat; background-size: 250px;}
    .lee{background: url(../img/lee.png) top center no-repeat; background-size: 250px;}

    /*qna*/
    .qna{width: 100%;}
    .qna+.qna{margin-left: 0;}
    .qna label {padding: 7px 0; font-size: 14px;}
    .qna label>i{margin-left: 5px;}
    .qna div th{width: 25%; font-size: 14px;}
    .qna div td{font-size: 14px;}
    .qna2 label {font-size: 14px; box-sizing: border-box;}
    .qna2>li>div {font-size: 14px;}
    .qna_other{font-size: 14PX;}
    .qna_other>span{display: block;}

    /*미사해설*/
    .mass_week a{height: 100px; line-height: 100px; font-size: 21px;}
    .mass_week div{width: 85%; height: 100px; font-size: 21px !important;}
    .mass li{float: none; font-size: 14px;}
    .mass li:nth-child(1){width: 100%;}
    .mass li:nth-child(2){width: 100%;}
    .mass li div{font-size: 14px;}

    /*이번호소개*/
    .table_of_content>div{float: none;}
    .table_of_content>div+div{margin-left: 0; margin-top: 5%;}
    .table_of_content>div>img{width: 50%; display: block; margin: 0 auto 10px auto;}
    .table_of_content>div:nth-child(1){width: 100%; text-align: center;}
    .table_of_content>div:nth-child(2){width: 100%;}
    .table_of_content>div>a{height: 35px; line-height: 35px; font-size: 14px;}
    .table_of_content>div>a:nth-child(2){float: none;}
    .table_of_content li{font-size: 14px;}

    /* 지난호보기 */
    .last a{width: 49%; font-size: 14px;}
    .last a+a{margin-left: 0;}
    .last a:nth-child(2n){margin-left: 2%;}
    .last a:nth-child(7){margin: 0;}
    .last a:nth-child(11){margin: 0;}
    .last a img{width: 100%;}
    .last a span{width: 100%; text-align: center; display: block;}

    /* 구독/영수증 */
    .subscribe{font-size: 14px;}
    .subscribe>a{height: 35px; line-height: 35px; width: 50%;}
    .expiry_date{font-size: 14px;}

    /* select search tag */
    .select {height: 35px; padding: 5px 20px 5px 10px; font-size: 14px; vertical-align: middle;}
    .search{width: 65%; height: 35px; font-size: 14px; vertical-align: middle;}
    .search input{height: 33px; line-height: 33px; font-size: 14px;}
    .re_search .search{width: 100%; margin-top: 1%;}
    .search a{width: 33px; height: 33px; line-height: 33px;}
    .hashtag a{font-size: 14px;}

    /* page */
    /*.pageWrap{display: none;}*/
    .mPage{width: 100%; text-align: center; display: block;}
    .mPage>a{width: 30%; margin: 0 auto; font-size: 14px; line-height: 3; color: #898989; display: block;}

    /*list sort*/
    .list_sort{font-size: 18px;}

    /*list*/
    .list li a{font-size: 14px;}
    .list img{width: 50%; margin-right: 0; margin-bottom: 3%;}
    .list ul{width: 100%;}
    .list ul>li>span{font-size: 14px;}
    .list ul>li>span.bible{letter-spacing: 0;}
    .list li .date{width: 100%; text-align: left;}
    .list .subject{font-size: 14px;}
    .list .month{font-size: 14px;}
    .list_subscribe{display: none;}
    .list_subscribe_m{border-top: 2px solid #111; display: block; transition: all 0.5s;}
    .list_subscribe_m>li{border-bottom: 1px solid #ccc; padding: 2%;}
    .list_subscribe_m>li>div{font-size: 14px;}
    .list_subscribe_m>li>div>span{width: 20%; line-height: 1; border-right: 1px solid #ddd; margin-right: 2%; display: inline-block;}
    .list_subscribe_m>li>div>a.print{background: #716f72; color: #fff; text-align: center; padding: 0 10px; border-radius: 5px; vertical-align: middle; display: inline-block;}
    .list_reference a{text-align: center;}
    .list_reference2 a>div.title{width: 100%; font-size: 14px; display: block;}
    .list_reference2 a>div.date{width: 100%; font-size: 14px; text-align: left; display: block;}
    .notice li.nothing{font-size: 14px;}
    .notice .title{width: 100% !important; padding: 0 !important;}
    .receipt span.subject{width: 100% !important; text-align: center; padding-bottom: 0;}
    .receipt span.btn{width: 100% !important; text-align: center !important; padding-top: 0;}
    .receipt span.btn>a{width: 50% !important; padding: 0 !important;}

    /*view*/
    .view li.subject{padding: 3% 2%;}
    .view li.subject .category{font-size: 14px;}
    .view li.subject .title{font-size: 18px;}
    .view li.subject div:nth-child(2){font-size: 14px;}
    .view li.file a{font-size: 14px;}
    .view li.cont{font-size: 14px;}
    .view li.cont .scroll_x a{width: 30%;}
    .view li.tag a{font-size: 14px;}
    .view li.edit>a{font-size: 14px;}

    /*write*/
    .write{display: none;}
    .write th{padding: 10px 15px; font-size: 14px;}
    .write td{padding: 10px 15px; font-size: 14px;}
    .write td input[type=text]{height: 35px; line-height: 35px; font-size: 14px;}
    .write td input[type=password]{height: 35px; line-height: 35px; font-size: 14px;}
    .write td input[type=file]{height: 35px; line-height: 35px; font-size: 14px;}
    .write td textarea{font-size: 14px;}
    .write td a{height: 35px; line-height: 35px; font-size: 14px;}
    .write td.email input[type=text]{width: 47% !important;}
    .write td.email select.select{margin-top: 5px; width: 70%;}

    .write_mobile{width: 100%; border-top: 2px solid #111; display: block;}
    .write_mobile li{border-bottom: 1px solid #ccc; padding: 10px; font-size: 14px;}
    .write_mobile li span.subject{width: 20%; display: inline-block;}
    .write_mobile input {width: 100%; background: #fff; outline: none; padding: 0 10px; box-sizing: border-box; font-size: 14px; height: 35px; line-height: 35px;}
    .write_mobile input:focus {background: #fff;}
    .write_mobile input[type=file]{line-height: 35px;}
    .write_mobile textarea{width: 100%; height: 200px; outline: none; padding: 5px 10px; box-sizing: border-box; font-size: 14px;}
    .write_mobile li>a{height: 35px; line-height: 35px; font-size: 14px;}
    .join_mobile li{font-size: 14px;}
    .join_mobile input{width: auto !important;}
    .join_mobile li a{height: 35px; line-height: 35px; background: #716f72; color: #fff; text-align: center; padding: 0 15px; border-radius: 5px; vertical-align: middle; display: inline-block;}
    .join_mobile li span+span{margin-left: 5px;}
    .join_mobile li>div{font-size: 14px; display: block;}

    /*btn*/
    .btnWrap a{width: 110px; height: 35px; line-height: 35px; font-size: 14px; letter-spacing: -1px; transition: all 0.5s;}

    /*log*/
    .login {width: 80%; margin: auto; padding-top: 100px;}
    .login h2 {font-size: 36px;}
    .login input {height: 50px; line-height: 50px; font-size: 14px;}
    .login div{line-height: 1; margin-top: 5%;}
    .login div a{font-size: 12px;}
    .btn_login{height: 50px; line-height: 50px; font-size: 14px;}

    /*find*/
    .find {width: 100%; height: 210px; margin:3% auto 0 auto;}
    .find input {height: 40px; line-height: 40px; font-size: 14px;}
    .btn_find{height: 40px; line-height: 40px; font-size: 16px;}

    /*join*/
    .step1 div{height: 300px; font-size: 14px;}
    .step3{padding: 5%;}
    .step3 div{font-size: 14px;}
    .step3 div:nth-child(1){font-size: 18px; letter-spacing: -0.5px;}
    .step3 a{width: 150px; height: 35px; line-height: 35px; font-size: 14px;}
    .church>li{font-size: 14px;}
    .church>li>a.btn{font-size: 14px;}
    .church>li>a{font-size: 14px;}

    /*mypage*/
    .serial>input{width: 100% !important; height: 35px; line-height: 35px; font-size: 14px;}
    .serial>a{width: 100% !important; height: 35px; line-height: 35px; font-size: 14px;}

    /*정책*/
    .email_reject>.noti{font-size: 14px;}
    .email_reject>.noti>i{font-size: 32px;}
    .email_reject>.rule>li{font-size: 14px;}
    .privacy>li{font-size: 14px;}
    .privacy>li div{font-size: 14px; padding-left: 15px;}

    /*웹진이용방법*/
    .howto p{font-size: 18px;}
    .howto img{width: 100%; margin-bottom: 3%;}
    .howto01_notice>div{font-size: 21px;}
    .howto01_notice>ul>li{font-size: 18px;}
    .howto01_notice>ul>li+li{margin-top: 3%;}
    .howto01_logout{font-size: 21px;}
    .howto02_notice{font-size: 21px;}
    /*--220217추가*/
    .howto02_notice{width: 100%;}
    .howto table{width: 100%;}
    /*220217추가--*/

}





@media screen and (max-width:650px) {

    #footer>li.info>span{margin: 0; display: block;}
}