/**********************************************
note : 정기구독 신청
**********************************************/

#subscription,
#subscription h1, #subscription h2, #subscription h3, 
#subscription h4, #subscription h5, #subscription h6 {font-family:'Apple SD Gothic Neo','Helvetica Neue','Roboto','Noto Sans KR','Malgun Gothic','dotum','Arial',sans-serif}

/* 기본 */
#subscription header {text-align:center;margin-left:auto;margin-right:auto;margin-bottom:3rem;padding-bottom:3rem;border-bottom:3px solid #000}
#subscription header h2 {font-weight:bold;margin-bottom:3rem}
#subscription header h2::after {content:'';display:block;width:40px;height:1px;background-color:#000;margin:15px auto;}
#subscription header .sub-txt {word-break:keep-all}
#subscription header .sub-txt:last-child {margin-bottom:0}
#subscription strong {font-weight:500}
#subscription .subscription_section {margin-bottom:5rem}
#subscription .subscription_section.gray {background-color:#f5f6f8;padding:30px;}
@media screen and (max-width: 63.9375em) {
	#subscription header h2 {font-size:2rem}
	#subscription header .sub-txt {text-align:center}
}

/* 상단 */
#subscription header .top_cont {text-align:left}
#subscription header .top_cont .box:first-child {margin-bottom:1.5rem;}
#subscription header .top_cont .box .img {width:100%;min-height:325px;overflow-y:hidden;background-image:url('/subscribe/image/top_img.jpg');background-position:center;}
#subscription header .btn-wrap {margin:30px 0 0}
#subscription header .btn-wrap .subs-btn {margin:0 10px;font-size:1.063rem;background-color:#00285b}
#subscription header .btn-wrap .subs-btn:first-child {background-color:#f3981f}
@medi screen and (max-width: 63.9375em) {

}

/* 월간지 안내 */
#subscription .section-title {font-weight:bold;}
#subscription .txt-cont {background-color:#f5f6f8;padding:30px;border-radius:10px;border:1px solid #ddd}
#subscription .info-list {margin-bottom:0}
#subscription .info-list li {margin-bottom:1rem}
#subscription .info-list li:last-child {margin-bottom:0}

/* 정기구독 혜택 */
#subscription h3 {font-size:1.5rem;font-weight:600;margin-bottom:1.5rem;}
#subscription .reward-list {margin:0;counter-reset:css-counter;}
#subscription .reward-list li {list-style:none}
#subscription .reward-list li {position:relative;padding:20px 32px 20px 112px;margin-bottom:1rem;border:1px solid rgb(233, 233, 233);border-radius:6px;background-color:#f8faff}
#subscription .reward-list li:last-child {margin-bottom:0;}
#subscription .reward-list li p {margin-bottom:0;font-weight:500}
#subscription .reward-list li::before{counter-increment:css-counter;content:counter(css-counter, decimal-leading-zero);position:absolute;top:50%;left:3.5rem;transform:translateY(-50%);color:#1954db;font-size:1.5rem;letter-spacing:normal;font-weight: bold;}

/* 정기구독료 안내 */
#subscription .subscription_section .panel_tab {display:grid;grid-template-columns:255px 1fr;column-gap:20px;padding:0}
#subscription .subscription_section .panel_tab .tit_price {display:block;margin-bottom:15px;font-weight:500;font-size:26px}
#subscription .subscription_section .panel_tab .txt_sub {color: #666;letter-spacing: -.25px}
#subscription .subscription_section .pay-info {display:grid;grid-template-columns:repeat(3, 1fr);column-gap:20px}
#subscription .subscription_section .pay-info .group {margin-bottom:10px}
#subscription .subscription_section .pay-info .tit_item {display:inline-block;padding:3px 15px 4px;border-radius:4px;font-weight:700;letter-spacing:.5px;vertical-align:top}
#subscription .subscription_section .pay-info .txt_price {font-weight:600;font-size:40px;font-style:normal;letter-spacing:-.05rem}
#subscription .subscription_section .pay-info .desc_price {position:relative;font-size:.875rem;font-weight:500}
#subscription .subscription_section .pay-info .desc_price::before {content:'/';margin:0 3px}
#subscription .subscription_section .pay-info .sum {display:flex;flex-wrpa:wrap;align-items:baseline}
#subscription .subscription_section .pay-info .group:first-child .tit_item {color:#ffb800;background:#fff5dc}
#subscription .subscription_section .pay-info .group:first-child .txt_price {color:#ffb800}
#subscription .subscription_section .pay-info .group:nth-child(2) .tit_item {color:#3877e1;background:#f1f5fd}
#subscription .subscription_section .pay-info .group:nth-child(2) .txt_price {color:#3877e1}
#subscription .subscription_section .pay-info .group:nth-child(3) .tit_item {color:#0c3ab6;background:#eef1fa}
#subscription .subscription_section .pay-info .group:nth-child(3) .txt_price {color:#0c3ab6}
#subscription .subscription_section .pay-info .group:nth-child(4) .tit_item {background:#f1f1f1}
#subscription .subscription_section .pay-info .group:nth-child(4) .txt_price {color:#303030}
#subscription .subscription_section .desc_etc {text-align:center;line-height:1.625;margin:20px 0;padding:15px 35px 17px;border-radius:4px;font-size:16px;font-weight:600;color:#232d64;background:#f2f5fb;letter-spacing:-.05rem}
@media screen and (max-width: 63.9375em) {
	#subscription .subscription_section .panel_tab {grid-template-columns:1fr}
	#subscription .subscription_section .pay-info {grid-template-columns:1fr;row-gap:20px;margin-left:-1.25rem;margin-right:-1.25rem;}
	#subscription .subscription_section .pay-info .group {border-bottom: 1px solid #d7d7d7;padding: 0 1.25rem 1.25rem;}
	#subscription .subscription_section .pay-info .group:first-child {border-top:1px solid #222;padding-top:2rem}
	#subscription .subscription_section .panel_tab .tit_price {margin-bottom:35px}
	#subscription .subscription_section .desc_etc {margin-top:20px;margin-left:-1.25rem;margin-right:-1.25rem;border-radius:0;}
	
}

/* 윤미정 / 1404171 / 20240909 */
#subscription .subscription_section .pay-info.full {display: grid;grid-template-columns: repeat(1, 1fr);column-gap: 20px;}
#subscription .subscription_section .pay-info.full .group .tit_item {background: #f1f1f1;color:#303030}
#subscription .subscription_section .pay-info.full .group .txt_price {color:#303030}
#subscription .subscription_section .pay-info.full .icon {font-size: 2rem;}
#subscription .subscription_section .pay-info.full .group .txt_price.point-txt {color:#f44e5c}
@media screen and (max-width: 39.9375em) {
	#subscription .subscription_section .pay-info.full .sum {flex-direction: column;}
}