@charset "utf-8";

.clfix{*zoom:1;}
.clfix:before,.clfix:after{display:table;line-height:0;content:"";}
.clfix:after{clear:both;}
.hidden {font-size:0;height:0;line-height:0;overflow:hidden;width:0}


/* PC */
.base-container {background:#eee;}
.base-main {margin-bottom:40px !important;}
.article-wrap {width:976px; margin:42px auto 200px !important; background:#fff; box-shadow: 0 10px 48px 8px rgba(0, 0, 0, 0.08);}
.pc-full {width:1180px;}

/* Article List */
.card-board {width:1130px; margin:auto;}
.card-board ul li {margin:0;}

.renewal .chac-article .ui-tab-pnl {padding: 1rem 0 0;}
.renewal .chac-article .ui-full-tab .ui-tab-btns {padding: 0;}
.renewal .chac-article .ui-full-tab .ui-tab-btns .ui-tab-btn:first-child {margin-left:2.4rem;}
.renewal .chac-article .ui-full-tab .ui-tab-btns .ui-tab-btn:last-child {margin-right:2.4rem;}
.ui-tab-board .ui-tab-btn {padding:5px 24px; margin:0 4px !important; font-size:16px; font-weight:normal; border:1.5px solid #d9dadc !important; border-radius:24px;}

.renewal .chac-article .ui-tab-btn.selected, 
.renewal .chac-article .ui-tab-btn[aria-selected=true] {border:1.5px solid #cfe3f7 !important; background:#f7fbff; padding-left:36px !important;}
.renewal .chac-article .ui-tab-btn.selected:after, 
.renewal .chac-article .ui-tab-btn[aria-selected=true]:after {content: ""; display: block; position: absolute; left: 15px; top: 12px; width:14px; height:16px; border-radius:40px; clip-path:polygon(11% 33%, 0 40%, 43% 80%, 100% 21%, 86% 19%, 42% 61%); z-index: 0}

.article-list {position:relative;display:block;background:#3f35b5; border-radius:24px; width:100%; height:346px; margin:0 auto; text-align:center; box-shadow:0 0 20px 0 rgba(0, 0, 0, 0.2); padding:48px 0 48px;}
.article-list .article-cate {color:#fff; font-size:18px; margin:0 0 12px; font-weight:normal;}
.article-list .article-tit {height:63px; color:#fff; font-size:24px; font-weight:bold; margin:0 0 24px; padding:0 24px; line-height:1.33;}
.article-list .article-tit .branding {display:block; height:28px; color:#fff; font-size:24px; font-weight:700; margin:0 0 5px; line-height:32px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.article-list .article-tit span {font-size:14px; font-weight:500; letter-spacing: -0.19px; line-height: 1.43;}
.article-list .article-thumb {width:128px; margin:0 auto;}=
.article-list .article-thumb.youtube {width:112px; margin:0 auto;}
.article-list .brandingDimed {position:absolute; top:0; width:100%; height:100%; border-radius:24px; background: linear-gradient(180deg, rgba(0, 0, 0, 0.7) 30%, rgba(0, 0, 0, 0.35) 70%, rgba(0, 0, 0, 0) 100%);}
.article-list .brandingCont {position:relative;}

.renewal .chac-article .ui-tab-pnl {display:flex; flex-wrap:nowrap;}
.card-board ul {display:flex; flex-wrap: wrap;}
.card-board ul li {width:376px; padding:12px 10px;}
.card-board ul li.sns-list .article-cate{color:#111;}
.card-board ul li.sns-list .article-tit{color:#111;}


/* sns */
#sns {display:none}

/* Article Contents */
.article-wrap {padding:0 0 60px;}

.article-wrap .article-header {position:relative; padding:80px 100px 0;}
.article-wrap .article-header h2{padding:0 0 100px; color:#fff; font-size:36px; font-weight:bold; line-height:1.39;}
.article-wrap .article-header .header-cate {color:#fff; font-size:20px; font-weight:500; letter-spacing:-0.25px; margin-bottom:8px;}
.article-wrap .article-header .header-thumb {position:absolute; top:80px; right:100px;}
.article-wrap .article-header .header-thumb img {display:block; width:160px;}

/* SNS 헤더 */
.article-wrap .article-header.sns-header {color:#111 !important;}
.article-wrap .article-header.sns-header h2{color:#111 !important; padding:0;}
.article-wrap .article-header.sns-header .header-cate {color:#111 !important;}
.article-wrap .article-header.sns-header .header-thumb {display:none;}

/* DIC 헤더 */
.article-wrap .article-header.dic-header {color:#111 !important; background:#fff;}
.article-wrap .article-header.dic-header h2{color:#111 !important; padding-bottom:32px;}
.article-wrap .article-header.dic-header h2 span {display:none;}
.article-wrap .article-header.dic-header .header-cate {color:#111 !important;}
.article-wrap .article-header.dic-header .header-thumb {position: unset; top:unset; right:unset;}
.article-wrap .article-header.dic-header .header-thumb #animation {width:476px; margin:auto;}
.article-wrap .article-header.dic-header .header-thumb #thumb {display:none;}

/* 브랜딩 헤더 */
.article-wrap .article-header.brnading-header {color:#111 !important; background:#fff;}
.article-wrap .article-header.brnading-header h2{color:#111 !important; padding:0 0 12px;}
.article-wrap .article-header.brnading-header h2 span {display:none;}
.article-wrap .article-header.brnading-header .sub-title-wrap {display:flex; margin:12px 0 0;}
.article-wrap .article-header.brnading-header .sub-title-wrap .mark {width:40px; height:40px; border-radius: 100px; margin-right:8px;}
.article-wrap .article-header.brnading-header .sub-title-wrap .youtube-mark {width:40px; height:40px; border-radius: 100px; background:#ccc url('/resources/images/article/thumb_youtube.png') no-repeat center center; background-size:40px;}
.article-wrap .article-header.brnading-header .sub-title-wrap .webtoon-mark {width:40px; height:40px; border-radius: 100px; background:#ccc url('/resources/images/article/thumb_webtoon.png') no-repeat center center; background-size:40px;}
.article-wrap .article-header.brnading-header .sub-title-wrap .webtoon-mark2 {width:40px; height:40px; border-radius: 100px; background:#ccc url('/resources/images/article/thumb_webtoon2.png') no-repeat center center; background-size:40px;}
.article-wrap .article-header.brnading-header .sub-title-wrap .webtoon-mark3 {width:40px; height:40px; border-radius: 100px; background:#ccc url('/resources/images/article/thumb_webtoon3.png') no-repeat center center; background-size:40px;}
.article-wrap .article-header.brnading-header .sub-title-wrap .sub-title {font-weight:400; font-size:17px; line-height:24px; color:#757679; padding:7px 0 0;}
.article-wrap .article-header.brnading-header .header-cate {color:#111 !important;}
.article-wrap .article-header.brnading-header .header-thumb,
.article-wrap .article-header.brnading-header .header-thumb #dimedThumb,
.article-wrap .article-header.brnading-header .header-thumb #thumb {display:none;}


.article-wrap .article-cont {padding:42px 0; font-size:18px; line-height:1.67; color:#757679;}
.article-wrap .article-cont h3 {padding:0 100px; margin:64px 0 24px; font-size:24px; line-height:1.5; font-weight:bold; color:#000; word-break:keep-all;}
.article-wrap .article-cont h4 {padding:0 100px; margin:32px 0 16px; font-size:20px; line-height:1.4; font-weight:bold; color:#000; word-break:keep-all;}
.article-wrap .article-cont p {padding:0 100px;}
.article-wrap .article-cont p.webtoon {padding:0; font-size:0;}
.article-wrap .article-cont sup {line-height:0;}
.article-wrap .article-cont .sup {padding:0 100px; margin:8px 0 0; font-size:16px; line-height:1.73;}
.article-wrap .article-cont strong {background:#ecf5ff}
.article-wrap .article-cont p img {display:block; width:476px; margin:32px auto 16px;}
.article-wrap .article-cont p.webtoon img {width:100%; max-width:776px; padding:0; margin:auto; font-size:0;}
.article-wrap .article-cont .full img {width:100%;}
.article-wrap .article-cont .player {width:776px; margin:auto;}
.article-wrap .article-cont .normal {width:776px; margin:0 100px; background:#f3f5f9;}
.article-wrap .article-cont .dic {background:#fff;}
.article-wrap .article-cont .normal img {display:block; width:476px !important; margin:auto;}
.article-wrap .article-cont .tag {margin:12px 0 60px; font-size:16px; font-weight:normal; line-height:1.63; color:#2c7fdf;}
.article-wrap .article-cont .img-caption {font-size:15px; font-weight:normal; line-height:1.6;}
.article-wrap .article-cont .article-movie {position:absolute; top:41%; left:50%; margin-left:-253px; width:506px; height:37.5%; background:#000;}
.center {text-align: center;}
.relative {position:relative;}

.only-pc {display:block;}
.only-mo {display:none;}

/* bullet */
.article-wrap .article-cont [class*=bul-round] {border-radius:16px; background:#f3f5f9; padding:24px; margin:32px 100px;}
.article-wrap .article-cont [class*=bul-round] li {color: #757679; font-size: 15px; line-height: 1.4;}
.article-wrap .article-cont [class*=bul-round] li:before {top: 10px; background: #8D8E90; width: 0.14rem; height: 0.14rem;}
.article-wrap .article-cont [class*=bul-round] li.highlight {color: #2c7fdf;}
.article-wrap .article-cont [class*=bul-round] li strong {color: #2c7fdf; background:none;}

/* bullet-box */
.article-wrap .article-cont [class*=bul-box] {border-radius:16px; background:#f3f5f9; padding:24px; margin:32px 100px;}
.article-wrap .article-cont [class*=bul-box] h4 {color: #757679; font-size: 15px; line-height: 1.57; font-weight:bold; margin-bottom:8px;}
.article-wrap .article-cont [class*=bul-box] p {padding:0; color: #757679; font-size: 15px; line-height: 1.4; font-weight:normal; letter-spacing:-0.19px;}
.article-wrap .article-cont .bul-list li {position:relative; margin-top: 0.4rem; color: #757679; font-size: 15px; line-height: 24px; padding-left:8px;}
.article-wrap .article-cont .bul-list li:before {display:block; position:absolute; content:''; top: 10px; left:0; border-radius:50%; background: #8D8E90; width: 0.14rem; height: 0.14rem;}
.article-wrap .article-cont .bul-list li.highlight {color: #2c7fdf;}
.article-wrap .article-cont .bul-list li strong {color: #2c7fdf; background:none;}

/* bg-round */
.article-wrap .article-cont .bg-round {border-radius:16px; background:#f3f5f9; padding:24px; margin:32px 100px; font-size: 15px; line-height: 1.4;}
.article-wrap .article-cont .bg-round strong {font-weight:bold; background:none;}

/* 심의필 */
.article-wrap .review-num {padding:0 100px; margin:40px 0 20px; color:#757679; font-size:14px; line-height:1.57; font-weight:normal;}
.article-wrap .review-num span {display:block;}

/* 목록보기 버튼 */
.article-list-btn {text-align:center;}
.article-list-btn a {margin:64px auto 120px; display:inline-block; color:#2c7fdf; font-size:16px; font-weight:500; background:#f3f9ff; padding:18px 126px 17px; border-radius:8px;}


/* 공유하기 */
.kakao-wrap {text-align:center; margin-top:40px;}
.kakao-wrap a {display:inline-block;}
.kakao-wrap .btn-kakao img {margin:0 auto; width:96px;}
.kakao-wrap p {font-size:16px; font-weight:500;}

.article-floating-btn {position:relative; bottom:0; padding:16px 0; width:100%; }
.article-floating-btn a {position:relative; display:block; margin:0 100px; background:#2c7fdf; color:#fff; border-radius:16px; padding:28px 24px 26px 96px;}
.article-floating-btn a.rule {padding:19px 24px 18px 96px;}
.article-floating-btn a:before {content:''; display: block; position: absolute; top: 22px; left: 32px; width:40px; height:40px; background:#fff; background-size:40px !important;}
.article-floating-btn a .s-txt {display:inline-block; font-size:20px; font-weight:500; margin-right:5px;}
.article-floating-btn a .l-txt {display:inline-block; font-size:20px; font-weight:bold;}
.article-floating-btn a .rule-num {font-size:12px; font-weight:normal; margin-top:4px; line-height:normal;}
.article-floating-btn a:after {content: ''; display: block; position: absolute; top: 30px; right: 32px; width: 24px; height: 24px; background: url('/m/resources/images/common/icon_util.png') no-repeat; background-position: -7px -80px; background-size: 220px;}

.btn-top {bottom:11rem !important;}
/*
SAMSUNG FIRE&MARINE INSURANCE CO.,LTD.
Modified: 2025-11-10 12:22:30, Deploy: 2025-11-11 16:23:34
Hash: d05102444fbb13176b1672077bb81c415dcea6d9
*/
