@charset "UTF-8";

/* 기본 색상 */
:root {
	--main-color: #062100;
	--accent-color:#741813;
	--dark-main-color: #1d1612;
	--sub-color: #886A44;
	--text-bright-color: #f3f0eb;
	--text-bright-y: #D9C8AB;
	--bright-color: #f3f0eb;
	--icon-color: #f3f0eb;
	--icon-bk-color: #ddd;
	--gray-color: #ddd;
	--large-width: 1000px;
	--middle-width: 800px;
}



/* 기본 설정: 페이지 전체 */
body {
	margin: 0;
	background-image: url(img/bg.png);
	font-family: '맑은 고딕',
		'Apple SD Gothic Neo','sans-serif';
}
html{
    overflow-x:hidden;
}
body{
    overflow-x:hidden;
}

/* header 헤더 */
header {
	position: absolute; 
	top: 0;
	left: 0;
	z-index: 100;
	width: 100%;
	background-color: var(--dark-main-color);
	color: var(--text-bright-y);
}

.nohero header {
	position: static;
	border-bottom: solid 1px var(--gray-color); 
}

/* headerA: 사이트 이름 */
.headA{
    display:flex;
    align-items:center;
    padding:18px 20px;
}

.headA img{
    display:block;
    width:180px;
    height:auto;
}

/* headerB: 네비게이션 메뉴 */
.headB ul {
	margin: 0;
	padding: 0;
	list-style: none;
	gap: 20px;
}
.headB a {
	display:block;
	padding:10px 24px;
	border:solid 1px var(--text-bright-y);
	border-radius:999px;
	color:var(--text-bright-y);
	font-size:12px;
	text-decoration:none;
	transition:0.3s;
}
.headB a:hover {
	background-color: var(--text-bright-y);
	opacity: 0.8;
	color: var(--dark-main-color);
}

@media (min-width:768px){

    header .container{

        display:flex;
        align-items:center;
        justify-content:space-between;

        width:100%;
        max-width:none;

        padding:0 120px;

        box-sizing:border-box;
    }

    .headB ul{
        display:flex;
    }
}


@media (min-width: 768px) {
	/* 큰 화면 전용 설정 */
	.headC {
		display: none;
	}

	.headB {
		display: block !important;
	}
}

/* headerC: 토글 버튼 */
@media (max-width: 767px) {
	header .container-small {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.headC {
	color: var(--text-bright-y);
	margin-right: 10px;
	padding: 0;
	border: none;
	outline: none;
	background: none;
	font-size: 28px;
	cursor: pointer;
	}
	.headC:hover {
		opacity: 0.3;
	}

	.headB {
		display: none;
	}

	.headB li{
        margin-left: 5px;
		margin-right: 5px;
    }

    .headB li:last-child{
        margin-bottom:0px;
    }
}


/*===========================================================================
 콘텐츠A: main-banner-image 히어로 이미지
 ===========================================================================*/

.conA{
	height:100vh;
	background:url(img/mainhero.png) center center;
	background-size:cover;
	display:flex;
	align-items:center;
	
}


.conA::before{
    content: "";
    position: absolute;
    inset: 0;

	background: linear-gradient(
  	  to right,
  	  rgba(20,15,12,.95) 0%,
  	  rgba(20,15,12,.85) 25%,
  	  rgba(20,15,12,0) 40%
	);

    z-index: 1;
}

.hero-wrap{
	width:100%;
	display:flex;
	align-items:center;
	position: relative;
    z-index: 2;
	margin-top: 80px;
	margin-left: 120px;
}

.hero-text{
	width:530px;
	color:#fff;
}

.hero-logo{
	width:220px;
	margin-bottom:70px;
}

.hero-logo img{
	width:100%;
	display:block;
}

.hero-sub{
	display:block;
	font-size:15px;
	color:#d7b171;
	margin-bottom:18px;
	letter-spacing:.02em;
}

.hero-text h1{
	font-size:66px;
	font-weight:700;
	line-height:1.15;
	margin:0;
}

.hero-sub-indent {
    display: inline-block;
    margin-left: 14px;
    color: inherit;
}

.hero-text h3{
	margin-top:22px;
	font-size:33px;
	font-weight:500;
	color:#d7b171;
}

.hero-text p{
	font-size:18px;
	line-height:1.9;
	color:#d7d7d7;
	margin-bottom:30px;
}

.hero-info{
	display:flex;
	gap:45px;
	margin-bottom:30px;
}

.info-box{
	display:flex;
	align-items:flex-start;
	gap:15px;
}

.info-box i{
	width:50px;
	height:50px;
	border:1px solid #9b7748;
	background: rgba(28, 21, 18, 0.06);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border-radius:50%;
	display:flex;
	justify-content:center;
	align-items:center;
	font-size:20px;
	color:#d7b171;
}

.info-box span{
	display:block;
	font-size:13px;
	color:#d7b171;
	margin-bottom:6px;
}

.info-box strong{
	font-size:15px;
	font-weight:400;
	line-height:1.0;
	color:#fff;
}

.hero-btn{
	display:flex;
	gap:18px;
}

.hero-btn a{
	width:200px;
	height:58px;
	display:flex;
	justify-content:center;
	align-items:center;
	text-decoration:none;
	border-radius:8px;
	font-size:16px;
	font-weight:600;
	transition:.3s;
}

.btn1{
	border:1px solid rgba(216,192,150,.6);
	color:#fff;

	background: rgba(28, 21, 18, 0.06);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);

	box-shadow: 0 8px 24px rgba(0,0,0,.15);
}

.btn1:hover{
	background:#b88f58;
}

.btn2{
	border:1px solid rgba(216,192,150,.6);
	color:#fff;

	background: rgba(28, 21, 18, 0.06);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);

	box-shadow: 0 8px 24px rgba(0,0,0,.15);
}

.btn2:hover{
	background:#b88f58;
}
/* ==================================================================
   Hero Mobile
================================================================== */

@media (max-width:767px){

.conA .container{
    width:100%;
    max-width:none;
    padding:0;
    margin:0;
}

.conA{
    position:relative;
    overflow:hidden;

    min-height:760px;

    display:flex;
    align-items:flex-end;

    background:url(img/mobilehero.png) 25% center / cover no-repeat;
}

.conA::before{
    content:"";
    position:absolute;
    inset:0;

    pointer-events:none;

    background:
    /* 왼쪽만 어둡게 */
    linear-gradient(
        to right,
        rgba(20,15,12,.82) 0%,
        rgba(20,15,12,.45) 28%,
        rgba(20,15,12,.12) 48%,
        rgba(20,15,12,0) 65%
    ),

    /* 아래만 살짝 */
    linear-gradient(
        to top,
        rgba(20,15,12,.55) 0%,
        rgba(20,15,12,.15) 28%,
        rgba(20,15,12,0) 55%
    );

    z-index:1;
}

.hero-wrap{
    display:flex;
    flex-direction:column;

    width:100%;
    margin:0;
    padding:90px 26px 42px;
}

.hero-text{
    width:100%;
    max-width:none;
}

.hero-sub{
	font-size:11px;
	margin-bottom:20px;
	letter-spacing:.08em;
}

.hero-text h1{
	font-size:32px;
	line-height:1.2;
	margin:0;
}

.hero-text h3{
	font-size:18px;
	margin:18px 0 18px;
}

.line{
	width:58px;
	margin:20px 0;
}

.hero-text p{
	font-size:12px;
	line-height:1.8;
	margin-bottom:30px;
}

.hero-info{

    display:flex;
    flex-direction:column;

    gap:18px;

    margin-top:60px;
    margin-bottom:32px;
}

.info-box{

    display:flex;
    align-items:center;

    gap:16px;

    width:100%;
}

.info-box i{

    width:46px;
    height:46px;

    font-size:18px;

    flex-shrink:0;
}

.info-box span{

    display:block;

    font-size:12px;

    color:#d7b171;

    margin-bottom:0px;
}

.info-box strong{

    font-size:14px;

    line-height:1.3;

    font-weight:370;
}


/* 버튼 */
.hero-btn{
    display:flex;
    flex-direction:column;
    gap:14px;

    width:100%;
}

.hero-btn a{
    display:flex;
    justify-content:center;
    align-items:center;

    width:100%;
    max-width: 330px;

    height:58px;
}
}

/*============================================================================
conB 안내사항
============================================================================*/

.conB{
	padding:100px 20px;
	background:#F4E9DA;
}

.conB .container{
	max-width:900px;
	margin:0 auto;
}


/* 제목 */

.conB-title{
	text-align:center;
	margin-bottom:45px;
}

.conB-title h2{
	margin:0;
	font-size:28px;
	font-weight:700;
	color:var(--dark-main-color);
}


/* 카드 */

.notice-card{
	display:flex;
	align-items:center;
	gap:40px;

	padding:35px 40px;
	margin-bottom:28px;

	background:rgba(255,255,255,.72);
	backdrop-filter:blur(15px);
	-webkit-backdrop-filter:blur(15px);

	border-radius:20px;

	box-shadow:
	0 12px 35px rgba(148,104,43,.16);
}

.notice-card:last-child{
	margin-bottom:0;
}


/* 아이콘 */

.notice-icon{

    flex-shrink:0;

    width:100px;
    height:100px;

    border-radius:50%;

    background:linear-gradient(#FCF6EE,#F2E2CC);

    display:flex;
    justify-content:center;
    align-items:center;
}

.notice-icon i{

    font-size:40px;
    color:#C9964B;
}

/* 텍스트 */

.notice-text{
	flex:1;
}


/* 제목 */

.notice-head{
	display:flex;
	align-items:center;
	gap:16px;
}

.notice-head .num{

	display:flex;
	align-items:center;
	justify-content:center;

	width:56px;
	height:34px;

	border-radius:999px;

	background:#C9964B;
	color:#fff;

	font-size:16px;
	font-weight:700;
}

.notice-head h3{

	margin:0;

	font-size:18px;
	font-weight:700;

	color:#6F4A24;
}


/* 선 */

.notice-line{

	width:100%;
	height:1.5px;

	margin: 20px 0 10px;

	background:#E6D4BC;
}


/* 카드1 */

.notice-text p{

	margin:0;

	font-size:16px;
	line-height:1.7;

	color:#444;
}


/* 카드2 */

.benefit-list{

	margin:0;
	padding:0;

	list-style:none;
}

.benefit-list li{

	display:flex;
	align-items:center;

	padding:12px 0;

	border-bottom:1px solid #E9DDCD;

	font-size:18px;
	line-height:1.6;

	color:#444;
}

.benefit-list li:last-child{
	border-bottom:none;
}

.benefit-list i{

	margin-right:14px;

	font-size:17px;
	color:#C9964B;
}

/*============================================================================
conB Mobile
============================================================================*/

@media (max-width:767px){

.conB{
	padding:70px 16px;
}

.conB .container{
	max-width:100%;
}

.conB-title{
	margin-bottom:30px;
}

.conB-title h2{
	font-size:24px;
}

/* 카드 */

.notice-card{

	display:flex;
	align-items:center;

	gap:16px;

	padding:20px 18px;

	margin-bottom:18px;

	border-radius:16px;
}

/* 아이콘 */

.notice-icon{

	width:72px;
	height:72px;

	flex-shrink:0;
}

.notice-icon img{
	width:38px;
}

/* 제목 */

.notice-head{
	gap:10px;
}

.notice-head .num{

	width:42px;
	height:26px;

	font-size:13px;
}

.notice-head h3{

	font-size:16px;
}

/* 라인 */

.notice-line{

	margin:14px 0 8px;
}

/* 본문 */

.notice-text p{

	font-size:12px;
	line-height:1.6;
}

/* 혜택 */

.benefit-list li{

	padding:8px 0;

	font-size:13px;
	line-height:1.5;
}

.benefit-list i{

	margin-right:10px;
	font-size:12px;
}

}



/*======================================================================================
conC 행사일정
======================================================================================*/

.conC{
	padding:100px 0;
	background:#F4E9DA;
}

.conC-title{
	text-align:center;
	margin-bottom:55px;
}

.conC-title h2{
	margin:0;
	font-size:28px;
	color:#1d1612;
}


/* 배경 */

.timetable{

	position:relative;

	height:700px;

	background:url(img/timetable.png) center center;
	background-size:cover;
	overflow:hidden;
}

.timetable::before{

	content:"";

	position:absolute;
	inset:0;

	background:linear-gradient(
		to right,
		rgba(20,15,12,.95) 0%,
		rgba(20,15,12,.88) 40%,
		rgba(20,15,12,0) 68%
	);

	z-index:1;
}


.timetable-wrap{

	position:relative;
	z-index:2;

	height:100%;
	
	margin-top: 20px;

	display:flex;
	align-items:center;

	padding-left:70px;
}


/*=======================
타임라인
=====================*/

.schedule{

	position:relative;
	margin-left: 70px;

	width:760px;

	display:flex;
	flex-direction:column;
}


.schedule::before{

	content:"";

	position:absolute;

	left:265px;
	top:22px;

	height:calc(100% - 100px);
	width:1px;

	background:#897d67;
}


/* 한 줄 */

.schedule-item{

	display:flex;
	align-items:flex-start;

	height:120px;

	position:relative;
}


.schedule-item:last-child{

	height:110px;
}


/* 시간 */

.time{

	width:130px;
	height:54px;

	border-radius:999px;

	background:#E7D4B2;

	display:flex;
	align-items:center;
	justify-content:center;

	gap:12px;

	font-size:19px;
	color:#221814;

	flex-shrink:0;
}


/* 점 */

.dot{

	position:absolute;

	left:257px;
	top:18px;

	width:16px;
	height:16px;

	border-radius:50%;

	background:#E7D4B2;

	z-index:3;
}


/* 텍스트 */

.schedule-text{

	margin-left:190px;
	margin-top:2px;
}

.schedule-text h3{

	margin:0 0 10px;

	font-size:22px;
	font-weight:700;

	color:#fff;
}

.schedule-text p{

	margin:0;

	font-size:17px;
	line-height:1.7;

	color:#D8CBBB;
}

/*========================================================================================
conC Mobile
========================================================================================*/

@media (max-width:767px){

.conC{
	padding:70px 0;
}

.conC-title{
	margin-bottom:35px;
}

.conC-title h2{
	font-size:24px;
}

/* 배경 */

.timetable{
	height:560px;
	background-position:68% center;
}

.timetable-wrap{
	padding-left:20px;
	padding-right:20px;
}

/* 일정 전체 */

.schedule{
	width:100%;
	margin-left:0;
}

/* 세로선 */

.schedule::before{
	left:110px;
	top:18px;
	height:calc(100% - 80px);
}

/* 한 줄 */

.schedule-item{
	height:100px;
}

.schedule-item:last-child{
	height:90px;
}

/* 시간 */

.time{
	width:80px;
	height:38px;

	font-size:14px;

	gap:8px;
}

.time i{
	font-size:13px;
}

/* 점 */

.dot{
	left:104px;
	top:15px;

	width:14px;
	height:14px;
}

/* 텍스트 */

.schedule-text{
	margin-left:55px;
	margin-top:0;
}

.schedule-text h3{
	font-size:18px;
	margin-bottom:6px;
}

.schedule-text p{
	font-size:13px;
	line-height:1.55;
}

}

/*====================================================================================
conD
========================================================================================*/

.conD{
    padding:70px 20px;
    background:#F4E9DA;
}

.conD .container{
    max-width:900px;
    margin:auto;
}

.conD-title{
    text-align:center;
    margin-bottom:50px;
}

.conD-title h2{
    font-size:28px;
    margin:0;
    color:#231815;
}

/* 카드 */

.detail-card{

    display:flex;
    align-items:center;
    gap:35px;

    padding:30px 40px;

    margin-bottom:28px;

    text-decoration:none;

    background:rgba(255,255,255,.75);

    backdrop-filter:blur(16px);

    border-radius:18px;

    box-shadow:0 12px 35px rgba(120,80,30,.12);

    transition:.35s;
}

.detail-card.fade-up.show:hover{

    transform: translateY(-6px);

    box-shadow: 0 18px 45px rgba(90,60,20,.18);

}

.detail-img{

    width:180px;
    flex-shrink:0;

}

.detail-img img{

    width:100%;
    display:block;

}

.detail-text{

    flex:1;

}

.detail-text span{

    display:block;

    font-size:15px;

    color:#AE8456;

    margin-bottom:10px;

}

.detail-text h3{

    margin:0 0 18px;

    font-size:38px;

    color:#3D2B20;

}

.detail-text p{

    margin:0;

    font-size:17px;

    line-height:1.8;

    color:#6F6F6F;

}

.detail-arrow{

    width:74px;
    height:74px;

    border-radius:50%;

    background:#6B4A31;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#fff;

    font-size:28px;

    flex-shrink:0;

}

.detail-card.dark{

    background:linear-gradient(90deg,#6A4327,#302017);

}

.detail-card.dark .detail-text span{
    color:#e2cda6;
}
.detail-card.dark .detail-text h3{
    color:#fff;
}
.detail-card.dark .detail-text p{

    color:#e5dac5;

}

.detail-arrow.light{

    background:#E5C78F;

    color:#4B311F;

}
/*============================================================================
conD Mobile
============================================================================*/

@media (max-width:767px){

.conD{
    padding:70px 16px;
}

.conD-title{
    margin-bottom:30px;
}

.conD-title h2{
    font-size:24px;
}

/* 카드 */

.detail-card{

    display:flex;
    flex-direction:row;
    align-items:center;

    gap:16px;

    padding:10px 18px;

    margin-bottom:18px;

    border-radius:16px;
}

/* 이미지 */

.detail-img{
    width:105px;
    flex-shrink:0;
}

.detail-img img{
    width:100%;
    display:block;
}

/* 텍스트 */

.detail-text{
    flex:1;
}

.detail-text span{
    font-size:11px;
    margin-bottom:5px;
}

.detail-text h3{
    font-size:18px;
    margin:0 0 8px;
    line-height:1;
}

.detail-text p{
    font-size:10px;
    line-height:1.2;
}

/* 화살표 */

.detail-arrow{

    width:40px;
    height:40px;

    font-size: 8px;

    flex-shrink:0;
}

}





/* ========================================Mobile-footer ========================================*/
footer {
	color: var(--text-bright-color);


	background-image: url("img/foot.png"); 
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;

	position: relative;
	overflow: hidden;
}

footer .container {
	padding: 40px 20px;
}

/* 로고 */
.footA {
	margin-bottom: 30px;
}

.footLogo img{
    width:250px;
	opacity: 90%;
    display:block;
	padding-bottom: 30px;
}

.footA h2 {
	margin-top: 0;
	margin-bottom: 20px;
	font-family: 'Montserrat',sans-serif;
	font-size: 24px;
	letter-spacing: 0.1em;
}

/* 사이트정보내용 */
.footB {
	margin-bottom: 20px;
	color:#ddd;
	color: var(--gray-color);
}

.footB p {
	margin-top: 10px;
	margin-bottom: 10px;
	font-size: 14px;
	line-height: 1.8;
}

.footB p2 {
	margin-top: 0;
	margin-bottom: 10px;
	font-size: 12px;
	line-height: 1.8;
    color: #c9c2b8;
}
.footB a {
	color: inherit;
	text-decoration: none;
}

.footB a:hover {
	color: var(--accent-color)
}

/* 저작권 */
.footC {
	font-size: 12px;
	opacity: 50%;
	text-align: left;
	font-family: 'Montserrat',sans-serif;
}

/* SNS메뉴 */
.footD {
	margin-bottom: 20px;
	margin:0;
    padding:0;
}

.footD ul{

    display:flex;
    gap:18px;

    margin:0;
    padding:0;

    list-style:none;
}

.footD li{

    list-style:none;
}

.footD a{

    width:40px;
    height:40px;

    display:flex;
    justify-content:center;
    align-items:center;

    border:1px solid rgba(255,255,255,.9);
    border-radius:50%;

    transition:.3s;
}

.footD a img{

    width:20px;
    height:20px;

    display:block;
}

.footD a:hover{

    background:#C9964B;
    border-color:#C9964B;
}

/* PC-footer */
@media (min-width: 768px) {
	footer .container {
		display: flex;
		flex-wrap: wrap;
		max-width: 1000px;
		max-width: var(--large-width);
		margin-left: auto;
		margin-right: auto;
	}
	.footA {
		flex: 0 0 40%;
	}
	.footB {
		flex: 0 0 60%;
	}
	.footC {
		flex: 0 0 100%;
		text-align: center;
	}
}



/*============================================================================
Scroll Animation
============================================================================*/

.fade-up{

	opacity:0;

	transform:translateY(24px);

	transition:
		opacity .7s ease,
		transform .7s ease;
}

.fade-up.show{

	opacity:1;

	transform:translateY(0);
}


/*=======================================
========================================
=====작가소개페이지=========================
==========================================
=========================================*/

/*====================================
conE Writer Hero
====================================*/

.conE{

    padding:70px 0px;

    background: url(img/whero.png) center center / cover no-repeat;
}

.conE .container{

    max-width:1200px;
    margin:auto;
}

.writer-wrap{

    display:flex;
    align-items:center;
    justify-content:flex-start;

    min-height:720px;
}

.writer-text{

    max-width:620px;
    padding-left: 20px;
    padding-top: 10px;
  
    position: relative;
    left: -12px;

}


/* 상단 문구 */

.writer-sub{

    display:block;

    margin-bottom:18px;

    font-size:16px;
    font-weight: 600;
    margin-bottom:20px;

    color:#B76E39;
}


/* 메인 제목 */

.writer-text h2{

    margin:0;

    font-size:76px;
    font-weight:700;
    line-height:1.05;

    color:#231815;
}


/* 영문 */

.writer-eng{

    display:block;

    margin-top: 0;
    margin-bottom:65px;

    font-family:"Cormorant Garamond", serif;
    font-size:32px;
    font-style:italic;
    font-weight:500;
    letter-spacing:.05em;

    color:#B57A43;
}


/* 인용 */

.quote{
    margin-top: 80px;
    max-width:600px;
}

.quote-icon{

    display:block;

    font-size:64px;

    color:#D7B98B;

    margin-bottom:22px;
}

.quote p{

    margin:0 0 48px;

    font-size:24px;
    font-weight:400;
    line-height:1.8;

    color:#231815;
}


/* 가운데 라인 */

.quote-divider{

    display:flex;
    align-items:center;
    gap:18px;

    margin-bottom:30px;
}

.quote-divider span{

    flex:1;
    height:1px;
    background:#CDAE87;
}

.quote-divider em{

    font-style:normal;

    color:#B57A43;

    font-size:18px;
}


/* 출처 */

.quote-source{

    display:block;

    margin-bottom:8px;

    font-size:16px;
    font-weight:500;

    color:#8B6C4D;
}

.quote small{

    display:block;

    font-size:17px;
    line-height:1.7;

    color:#9D8061;
}

/*====================================
conE Mobile
====================================*/

@media (max-width:767px){

.conE{
    padding:10px 20px;
    position:relative;
    background:url(img/wherom.png) center / cover no-repeat;
}

.writer-wrap{
    display:flex;
    flex-direction:column;
    align-items:center;

    gap:0;
}


/* 텍스트 */

.writer-text{
    width:100%;
    max-width:340px;

    text-align:center;

    padding:0;
    margin-top:40px;

    left:0;
}

.writer-sub{
    text-align:center;
}



.writer-eng{
    display:block;
    text-align:center;
    font-size:12px;
    margin:8px 0 40px;
}


/* 따옴표 */

.quote i{

    font-size:24px;

    color:#CDB393;

    margin-bottom:18px;
    margin-top: 40px;
}


/* 인용문 */

.quote{
    width:100%;
    max-width:340px;

    margin-left: 20px;

    text-align:left;

    margin-bottom: 60px;
}

.quote-icon{
    text-align:left;
}

.quote p{
    text-align:left;
    font-size: 10px; 
    line-height:1.2;
    margin-bottom:10px;
}

/* 라인 */
.quote-divider{
    margin-bottom:20px;
    text-align: center;
    width:300px;
}

.quote-divider em{
    font-size:8px;
}

.quote-source{
    text-align:center;
    font-size:10px;
    margin-bottom:4px;
}

.quote small{
    text-align:center;
    font-size:12px;
    line-height:1.0;
}

}
/*====================================
conF
====================================*/

.conF{

    padding:90px 20px;

    background:linear-gradient(90deg,#6C4326,#322117);
}

.conF .container{

    max-width:1120px;
    margin:auto;
}

.theme-wrap{

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:70px;
}

/* 이미지 */

.theme-img{

    flex:0 0 400px;
}

.theme-img img{

    width:100%;
    display:block;
}

/* 텍스트 */

.theme-text{

    flex:1;
    color:#fff;
}

.theme-text span{

    display:block;

    font-size:15px;

    color:#C79A67;

    margin-bottom:14px;
}

.theme-text h2{

    margin:0 0 22px;

    font-size:48px;

    line-height:1.2;
}

.theme-text p{

    font-size:18px;

    line-height:1.9;

    color:#DDD3CA;
}

/* 태그 */

.theme-tag{

    display:flex;
    flex-wrap:wrap;

    gap:12px;

    margin-top:32px;
}

.theme-tag span{

    display:flex;
    justify-content:center;
    align-items:center;

    padding:10px 22px;

    border-radius:999px;

    background:#F2E2CC;

    color:#3D2B20;

    font-size:15px;

    font-weight:600;
}
/*============================================================================
conF Mobile
============================================================================*/

@media (max-width:767px){

    .conF{
    padding: 90px 20px 100px;
}


/* 레이아웃 */

.theme-wrap{

    display:flex;
    flex-direction:column;
    align-items:center;

    gap:18px;
}

/* 이미지 */

.theme-img{

	flex:none;

    width:62%;
    max-width:240px;

    padding-top: 10px;;
}

.theme-img img{

    width:100%;
    display:block;

    border-radius:0;

}

/* 텍스트 */

.theme-text{

    width:100%;
    text-align:center;
}

.theme-text span{

    display:block;

    font-size:13px;

    color:#D8A86B;

    margin-bottom:6px;
}

.theme-text h2{

    margin:0 0 14px;

    font-size:40px;
    line-height:1.1;

    color:#fff;
}

.theme-text p{

    margin:0 auto;

    width:96%;

    font-size:16px;

    line-height:1.8;

    color:#ECE3DA;

    word-break:keep-all;
}

/* 태그 */

.theme-tag{

    display:flex;

    justify-content:center;
    flex-wrap:nowrap;

    gap:8px;

    margin-top:20px;
}

.theme-tag span{

    display:flex;

    justify-content:center;
    align-items:center;

    min-width:70px;
    height:34px;

    padding:0 1px;

    border-radius:999px;

    background:#F3E3CD;

    color:#3D291B;

    font-size:13px;

    font-weight:600;

    white-space:nowrap;
}

}



/*====================================
conG
====================================*/

.conG{

    padding:90px 20px;

    background:#EEDAC8;
}

.conG .container{

    max-width:1120px;
    margin:auto;
}

/* conF와 동일 */
.conG .theme-wrap{

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:70px;
}

/* 이미지 오른쪽 */
.conG .theme-wrap.reverse{

    flex-direction:row;
}

.conG .theme-img{

    flex:0 0 400px;
}

.conG .theme-img img{

    width:100%;
    display:block;
}

.conG .theme-text{

    flex:1;
}

.conG .theme-text span{

    display:block;

    font-size:15px;

    color:#B67A46;

    margin-bottom:14px;
}

.conG .theme-text h2{

    margin:0 0 22px;

    font-size:48px;

    color:#231815;
}

.conG .theme-text p{

    font-size:18px;

    line-height:1.9;

    color:#555;
}

.conG .theme-tag{

    display:flex;

    flex-wrap:wrap;

    gap:12px;

    margin-top:30px;
}

.conG .theme-tag span{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    height:20px;
    padding: 10px 24px;

    border-radius:999px;

    background:#D8B07A;
    color:#fff;

    font-size:14px;
    font-weight:600;

    white-space:nowrap;
}
/*============================================================================
conG Mobile
============================================================================*/

@media (max-width:767px){

.conG{

    padding:56px 20px;
    background:#EEDAC8;
}

/* 레이아웃 */

.conG .theme-wrap,
.conG .theme-wrap.reverse{

    display:flex;
    flex-direction:column-reverse !important;

    align-items:center;
    justify-content:flex-start;

    gap:18px;
}

/* 이미지 */

.conG .theme-img{

    flex:none;

    width:80%;
    max-width:240px;

    margin:0;
}

.conG .theme-img img{

    width:100%;
    display:block;

}

/* 텍스트 */

.conG .theme-text{

    flex:none;

    width:100%;

    text-align:center;

    margin:0;
}

.conG .theme-text span{

    display:block;

    font-size:13px;

    color:#B67A46;

    margin-bottom:6px;
}

.conG .theme-text h2{

    margin:0 0 14px;

    font-size:42px;

    line-height:1.1;

    color:#231815;
}

.conG .theme-text p{

    max-width:330px;

    margin:0 auto;

    font-size:16px;

    line-height:1.8;

    color:#555;

    word-break:keep-all;
}

/* 태그 */

.conG .theme-tag{

    display:flex;

    justify-content:center;

    flex-wrap:wrap;

    gap:8px;

    margin-top:22px;
}

.conG .theme-tag span{

    display:flex;

    justify-content:center;
    align-items:center;

    min-width:60px;

    height:34px;

    padding:0 1px;

    border-radius:999px;

    background:#D8B07A;

    color:#fff;

    font-size:13px;

    font-weight:600;

    white-space:nowrap;
}

}


/*========================================
conH
========================================*/

.conH{
    position:relative;
    overflow:hidden;
  
    padding:100px 20px;
    background:url(img/sbg2.png) center center / cover no-repeat;

    padding:100px 20px;
}


.conH .container{
    position:relative;
    z-index:1;
}

/* 제목 */

.conH-title{

    text-align:center;

    margin-bottom:60px;
}

.conH-title h2{

    margin:0;

    font-size:32px;

    color:#fff;

    font-weight:700;
}

/* 수상 */

.award-wrap{

    display:flex;

    justify-content:center;
    align-items:flex-start;

    gap:60px;
}

.award-item{

    flex:none;

    display:flex;
    justify-content:center;

    transition:.35s;
}

.award-item img{

    width:100%;
    max-width:300px;

    display:block;
}

.award-item:hover{

    transform:translateY(-8px);
}

/*============================================================================
conH Mobile
============================================================================*/

@media (max-width:767px){

.conH{

    padding:70px 20px;
    background:url(img/sbg.png) center center / cover no-repeat;
    
}
.conH::before{

    width:100%;
    height:100%;

    left:0;
    top:0;

    transform:none;

    background:url(img/sbg.png) center/cover no-repeat;
}


.conH-title{

    margin-bottom:36px;
}

.conH-title h2{

    font-size:24px;
}

.award-wrap{

    display:flex;
    flex-direction:column;

    align-items:center;

    gap:24px;
}

.award-item{

    width:100%;
}

.award-item img{

    width:60%;
    max-width:260px;

    margin:auto;
}

}


/*====================================
conI 대표 도서
====================================*/

.conI{

    padding:100px 20px;

     background: url(img/bbgp.png) center center / cover no-repeat;
}

.conI .container{

    max-width:1200px;
    margin:auto;
}

/* 제목 */

.conI-title{

    text-align:center;

    margin-bottom:60px;
}

.conI-title h2{

    margin:0;

    font-size:32px;

    color:#231815;
}


/*==============================
캐러셀
==============================*/

.book-stage{

    position:relative;

    height:520px;

    overflow:visible;
}


/* 책 */

.book-list{

    position:relative;

    width:100%;
    height:100%;
}

.book-item{

    position:absolute;

    left:50%;
    top:20px;

    width:200px;
    height:300px;

    transform:translateX(-50%);

    border-radius:8px;

    overflow:hidden;

    box-shadow:
        0 18px 36px rgba(0,0,0,.18);

    transition:
    transform .45s ease,
    opacity .45s ease,
    filter .45s ease;

    cursor:pointer;
}

.book-item img{

    width:100%;
    height:100%;


    display:block;
}


/* 책장 */

.book-shelf{

    position:absolute;

    left:50%;
    bottom:70px;

    transform:translateX(-50%);

    width:760px;
    height:12px;

    background:linear-gradient(#6A4327,#302017);

    border-radius:4px;
}


/*==============================
버튼
==============================*/

.book-nav{

    position:absolute;

    top:160px;

    width:60px;
    height:60px;

    border:none;

    border-radius:50%;

    background:#fff;

    color:#3B291D;

    box-shadow:
        0 8px 18px rgba(0,0,0,.13);

    cursor:pointer;

    transition:.3s;

    z-index:20;
}

.book-nav:hover{

    background:#6A4327;

    color:#fff;
}

.book-nav i{

    font-size:22px;
}

.book-nav.prev{

    left:0;
}

.book-nav.next{

    right:0;
}


/*==============================
정보
==============================*/

.book-info{

    text-align:center;

    margin-top:-5px;
}

.book-info h3{

    margin:0 0 12px;

    font-size:34px;

    color:#231815;
}

.book-info p{

    margin:0;

    font-size:18px;

    color:#6B5645;
}


/*==============================
dots
==============================*/

.book-dots{

    display:none;

    justify-content:center;

    gap:10px;

    margin-top:10px;
}

.book-dots span{

    width:9px;
    height:9px;

    border-radius:50%;

    background:#ccb9a8;
}

.book-dots span.active{

    background:#7C5536;
}


/*==================================================
Mobile
==================================================*/

@media (max-width:767px){

.conI{

    background: url(img/bbgm.png) center center / cover no-repeat;
    padding:70px 16px;
}

.conI-title{

    margin-bottom:36px;
}

.conI-title h2{

    font-size:24px;
}


/* 캐러셀 */

.book-stage{

    height:380px;
}


/* 책 */

.book-item{

    width:170px;
    height:250px;

    top:15px;
}

.book-item img{

    width:100%;
    display:block;

    filter: drop-shadow(0 12px 20px rgba(0,0,0,.22));
}


/* 책장 */

.book-shelf{

    width:230px;

    bottom:48px;
}


/* 버튼 */

.book-nav{

    width:48px;
    height:48px;

    top:105px;
    opacity: 0;
}

.book-nav i{

    font-size:18px;
}


/* 정보 */

.book-info{

    margin-top:10px;
}

.book-info h3{

    font-size:28px;

    margin-bottom:8px;
}

.book-info p{

    font-size:14px;

    line-height:1.6;
}


/* dots */

.book-dots{

    display:flex;
}

}




/*=======================================
========================================
=====작가소개페이지=========================
==========================================
=========================================*/

/*====================================
conE Writer Hero
====================================*/

.conJ{

    padding:70px 0px;

    background: url(img/bhero.png) center center / cover no-repeat;
}

.conJ .container{

    max-width:1200px;
    margin:auto;
}

.writer-wrap{

    display:flex;
    align-items:center;
    justify-content:flex-start;

    min-height:720px;
}

.writer-text{

    max-width:620px;
    padding-left: 60px;
    padding-top: 10px;
  
    position: relative;
    left: -20px;

}


/* 상단 문구 */

.writer-sub{

    display:block;

    margin-bottom:18px;

    font-size:16px;
    font-weight: 600;
    margin-bottom:20px;

    color:#A67806;
}


/* 메인 제목 */

.writer-text h2{

    margin:0;

    font-size:76px;
    font-weight:700;
    line-height:1.05;

    color:#231815;
}


/* 영문 */

.writer-eng{

    display:block;

    margin-top: 0;
    margin-bottom:65px;

    font-family:"Cormorant Garamond", serif;
    font-size:32px;
    font-style:italic;
    font-weight:500;
    letter-spacing:.05em;

    color:#A67806;
}


/* 인용 */

.quote{
    margin-top: 80px;
    max-width:600px;
}

.quote-icon{

    display:block;

    font-size:64px;

    color:#D7B98B;

    margin-bottom:22px;
}

.quote p{

    margin:0 0 48px;

    font-size:24px;
    font-weight:400;
    line-height:1.8;

    color:#231815;
}


/* 가운데 라인 */

.quote-divider{

    display:flex;
    align-items:center;
    gap:18px;

    margin-bottom:30px;
}

.quote-divider span{

    flex:1;
    height:1px;
    background:#CDAE87;
}

.quote-divider em{

    font-style:normal;

    color:#B57A43;

    font-size:18px;
}


/* 출처 */

.quote-source{

    display:block;

    margin-bottom:8px;

    font-size:16px;
    font-weight:500;

    color:#8B6C4D;
}

.quote small{

    display:block;

    font-size:17px;
    line-height:1.7;

    color:#9D8061;
}

/*====================================
conJ Mobile
====================================*/

@media (max-width:767px){

.conJ{
    padding:70px 22px;
    background:url(img/bherom.png) center top / cover no-repeat;
}

.writer-wrap{

    display:flex;
    flex-direction:column;

    align-items:center;

    gap:30px;
}


/* 텍스트 */

.writer-text{
    text-align:center;
    padding-left: 20px;
    transform:translateY(-10px);
}

.writer-sub{
    text-align:center;
}

.writer-text h2{
    font-size:40px;
    line-height:1.08;
    text-align:center;
    margin:0;
}

.writer-eng{
    display:block;
    text-align:center;
    font-size:22px;
    margin:8px 0 40px;
}


/* 따옴표 */

.quote i{

    font-size:34px;

    color:#CDB393;

    margin-bottom:18px;
    margin-top: 40px;
}


/* 인용문 */

.quote{
    text-align:left;
    margin-top: 380px;
    transform:translateX(25px);

}

.quote-icon{
    text-align:left;
}

.quote p{
    text-align:left;
    font-size:18px; 
    line-height:1.8;
    margin-bottom:10px;
}

/* 라인 */
.quote-divider{
    margin-bottom:20px;
    width: 250px;
}
.quote-divider em{
    font-size:14px;
}

.quote-source{
    text-align:left;
    font-size:14px;
    margin-bottom:4px;
}

.quote small{
    text-align:left;
    font-size:12px;
    line-height:1.6;
}

}

/*====================================
conK
====================================*/

.conK{

    padding:0;
}

.band-hero{

    position:relative;

    width:100%;
    height:560px;

    overflow:hidden;
}


/* 사진 */


.band-hero img{

    width:55%;
    height:100%;

    object-fit:cover;
    object-position:left center;
}

/* 그라디언트 */

.band-overlay{

    position:absolute;
    inset:0;

    background:linear-gradient(
        to right,
        rgba(35,25,18,0) 18%,
        rgba(35,25,18,.35) 35%,
        rgba(35,25,18,.78) 46%,
        #2B2018 50%,
        #251c14 100%
    );
}


/* container */

.band-overlay .container{

    max-width:1200px;

    height:100%;

    margin:auto;

    display:flex;
    justify-content:flex-end;
    align-items:center;
}


/* 텍스트 */

.band-text{

    width:470px;

    color:#fff;
}

.band-text span{

    display:block;

    margin-bottom:18px;

    color:#D2A248;

    font-size:17px;
    font-weight:600;
}

.band-text h2{

    margin:0 0 35px;

    font-size: 42px;
    line-height:1.2;

    font-weight:700;
}

.band-text p{

    margin:0;

    font-size:20px;
    line-height:1.9;

    color:#EFE6DB;
}
/* ==========================
   Mobile
========================== */

@media (max-width:767px){

.conK{
    padding:0;
}

/* 전체 영역 */

.band-hero{

    position:relative;

    height: 580px;

    overflow:hidden;

    background:#2B2018;
}

/* 사진 */

.band-hero img{

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:auto;

    object-fit:contain;

    display:block;
}

/* 아래 단색 + 위로 자연스럽게 그라데이션 */

.band-overlay{

    position:absolute;
    inset:0;

    display:flex;
    align-items:flex-end;

    background:linear-gradient(
        to top,
        #2B2018 0%,
        #2B2018 34%,
        rgba(43,32,24,.96) 48%,
        rgba(43,32,24,.72) 53%,
        rgba(43,32,24,.30) 72%,
        rgba(43,32,24,0) 90%
    );
}

.band-overlay .container{

    width:100%;

    padding:0 28px 56px;
    margin-top: 180px;

    box-sizing:border-box;
}

/* 텍스트 */

.band-text{

    width:100%;
    padding-left: 0;
    color:#fff;
}

.band-text span{

    display:block;

    margin-bottom:12px;

    font-size:14px;
    font-weight:600;

    color:#D7A949;
}

.band-text h2{

    margin:0 0 22px;

    font-size: 28px;
    line-height:1.25;
}

.band-text p{

    margin-top: 0px;

    font-size:16px;
    line-height:1.9;

    color:#EFE6DB;
}

}


.conL{
    padding:120px 20px;
    text-align:center;

    background:url(img/sb2.png) center center / cover no-repeat;

    overflow:hidden;
}

.conL .container{
    max-width:820px;
    margin:0 auto;
}


/* ==========================
   구분선
========================== */

.intro-divider{
    display:flex;
    justify-content:center;
    align-items:center;
    margin-bottom:36px;
}

/* 기본 실선 */

.intro-divider::before,
.intro-divider::after{
    content:"";
    width:180px;
    height:2px;
    background:#C79A3B;
}

.intro-divider span{
    margin:0 26px;
    font-size:28px;
    line-height:1;
    color:#C79A3B;
}

/* 점선 */

.intro-divider.dotted::before,
.intro-divider.dotted::after{
    height:2px;
    background:repeating-linear-gradient(
        to right,
        #C79A3B 0 4px,
        transparent 4px 10px
    );
}


/* ==========================
   문단
========================== */

.intro-text{
    margin:0;
    margin-bottom:56px;

    font-family:'Pretendard';
    font-size:20px;
    font-weight:400;
    line-height:2.1;
    color:#3B2B21;
}

.intro-text.second{
    margin-top:36px;
    margin-bottom:0;
}


/* ==========================
   Mobile
========================== */

@media (max-width:767px){

    .conL{
    position:relative;
    overflow:hidden;
    padding:80px 24px;

    /* 배경 제거 */
    background:#FFF8EE;
    }

    .conL::before{
    content:"";

    position:absolute;
    inset:0;

    background:
        linear-gradient(
            rgba(255, 234, 206, 0.68),
            rgba(255,248,238,.48)
        ),
        url(img/sb2.png);

    background-repeat:no-repeat;
    background-size:cover;
    background-position:left center;

    z-index:0;
    }

    .conL .container{
    position:relative;
    z-index:1;
    }

    .intro-divider::before,
    .intro-divider::after{
        width:90px;
        height:2px;
    }

    .intro-divider.dotted::before,
    .intro-divider.dotted::after{
        height:2px;
        background:repeating-linear-gradient(
            to right,
            #C79A3B 0 4px,
            transparent 4px 9px
        );
    }

    .intro-divider span{
        margin:0 16px;
        font-size:22px;
    }

    .intro-text{
        font-size:16px;
        line-height:2;
        margin-bottom:42px;
    }

    .intro-text.second{
        margin-top:30px;
        margin-bottom:0;
    }

}

/*====================================
conM Hero
====================================*/

.conM{

    position:relative;

    overflow:hidden;

    background:url(img/a1.png) center center / cover no-repeat;

    min-height:800px;
}

.conM::before{

    content:"";

    position:absolute;
    inset:0;

    background:linear-gradient(
        90deg,
        rgba(25,18,13,.72) 0%,
        rgba(25,18,13,.48) 35%,
        rgba(25,18,13,.18) 65%,
        rgba(25,18,13,0) 100%
    );
}

.conM .container{

    position:relative;

    z-index:2;

    max-width:1200px;

    margin:auto;

    height:720px;
}

.aroma-hero{

    display:flex;

    align-items:center;

    height:100%;
}

.aroma-content{

    max-width:560px;

    color:#fff;

    padding-left:20px;
}

/* 상단 */

.aroma-sub{

    display:block;

    margin-bottom:18px;

    font-size:17px;

    font-weight:500;

    letter-spacing:.08em;

    color:#D9B67A;
}

/* 제목 */

.aroma-title{

    margin:0;

    font-size:74px;

    font-weight:700;

    line-height:1.08;

    color:#fff;
}

/* 부제 */

.aroma-lead{

    margin:22px 0 30px;

    font-size:30px;

    font-weight:500;

    color:#F7E8D3;
}

/* 설명 */

.aroma-desc{

    margin:0;

    font-size:22px;

    line-height:2;

    color:#ECE6DE;
}

/* 오른쪽 */

.aroma-image{

    flex:1;

    display:flex;

    justify-content:flex-end;

    align-items:center;

    overflow:visible;
}
/*====================================
conM Mobile
====================================*/

@media (max-width:767px){

.conM{

    min-height:720px;

    background:url(img/a1.png)
    right / cover no-repeat;
}

.conM::before{

    background:linear-gradient(
        to top,
        rgba(26,18,13,.90) 0%,
        rgba(26,18,13,.65) 48%,
        rgba(26,18,13,.25) 58%,
        rgba(26,18,13,0) 100%
    );
}

.conM .container{

    height:720px;
}

.aroma-hero{

    align-items:flex-end;
}

.aroma-content{

    max-width:none;

    width:100%;

    padding:0 26px 72px;
}

.aroma-sub{

    font-size:14px;

    margin-bottom:12px;
}

.aroma-title{

    font-size:46px;

    line-height:1.12;
}

.aroma-lead{

    margin:16px 0 22px;

    font-size:22px;
}

.aroma-desc{

    font-size:16px;

    line-height:1.9;
}

}



/*====================================
conN
====================================*/

/*====================================
conN
====================================*/

.conN{

    padding:140px 0;

    background:#F2E9E0;
}

.conN .container{

    max-width:1100px;

    margin:auto;

    padding:0 20px;
}

.aroma-wrap{

    display:flex;

    justify-content:space-between;

    gap:60px;

    align-items:flex-start;
}

/*=====================
Left
======================*/

.aroma-left{

    flex:0 0 420px;
}

.aroma-title{

    display:flex;
    align-items:flex-start;

    gap:22px;

    margin-bottom:45px;
}

.aroma-num{

    font-size:64px;

    font-family:'Cormorant Garamond', serif;

    color:#9C7752;

    line-height:1;
    margin-top:-20px;
}

.aroma-title h2{

    margin:0;

    font-size:30px;

    line-height:1.35;

    color:#2B1F18;
}

.title-line{

    width:70px;

    height:2px;

    margin-top:20px;

    background:#D9C4AA;
}

.aroma-list{

    display:flex;

    flex-direction:column;

    gap:18px;
}

.aroma-item{

    display:flex;

    align-items:center;

    gap:22px;

    padding:24px 28px;

    background:#fff;

    border:1px solid #E6D8C8;

    border-radius:16px;

    transition:.3s;
}

.aroma-item:hover{

    transform:translateY(-3px);

    box-shadow:0 12px 28px rgba(0,0,0,.08);
}

.aroma-icon{

    width:42px;

    display:flex;

    justify-content:center;

    font-size:32px;

    color:#9C7752;
}

.aroma-item p{

    margin:0;

    font-size:18px;

    line-height:1.7;

    color:#40342E;
}

/*=====================
Right
======================*/

.conN-right{

    flex:1;

    display:flex;

    justify-content:center;

    align-items:flex-start;
}

.aroma-right{

    flex:1;

    display:flex;

    justify-content:center;

    align-items:flex-start;
}
.conN-photo{

    width:72%;

    max-width:680px;
}

.conN-photo img{

    width:100%;

    height:600px;

    object-fit:cover;

    object-position:center;

    border-radius:22px;

    display:block;

    box-shadow:0 18px 45px rgba(0,0,0,.12);
}

.photo-caption{

    margin-top:18px;

    text-align:center;

    font-size:15px;

    line-height:1.7;

    color:#8B7B6D;
}

@media (max-width:767px){

    .conN .container{
        max-width:100%;
        padding:0 24px;
    }

    .aroma-wrap{
        flex-direction:column;
        gap:36px;
        align-items:center;
    }

    .aroma-num{
        font-size: 42px;
        padding-top: 10px;

    }



    .aroma-left{
        width:100%;
    }

    .conN-right{
        width:100%;
        display:flex;
        justify-content:center;
    }

    .conN-photo{
        width:100%;
        max-width:520px;
    }

    .conN-photo img{
        width:100%;
        height:460px;      /* 원하는 높이 */
        object-fit:cover;
        object-position:center;
        border-radius:22px;
        display:block;
    }

    .photo-caption{
        margin-top:14px;
        font-size:13px;
        line-height:1.6;
    }

}


/*====================================
conO
====================================*/

.conO{

    padding:90px 0 160px;

    background:#F2E9E0;
}

.conO .container{

    max-width:1200px;

    margin:auto;

    padding:0 20px;
}

/* 전체 */

.aroma-process{

    display:grid;

    grid-template-columns:470px 1fr;

    gap:80px;

    align-items:center;
}

/* 사진 */

.aroma-process-photo{

    width:100%;

    height:620px;

    border-radius:28px;

    background:#d8d8d8;

    overflow:hidden;

    box-shadow:0 20px 50px rgba(0,0,0,.08);
}

/* 오른쪽 */

.aroma-process-content{

    display:flex;

    flex-direction:column;
}

.aroma-process-content .aroma-title-box{

    text-align:left;

    margin-bottom:60px;
}

/* 단계 */

.aroma-process-list{

    display:flex;

    align-items:flex-start;

    justify-content:space-between;

    gap:20px;
}

.aroma-step{

    flex:1;

    text-align:center;

    position:relative;
}

.aroma-step-icon{

    width:82px;

    height:82px;

    margin:0 auto 22px;

    border-radius:50%;

    background:#E7D5C4;

    display:flex;

    justify-content:center;

    align-items:center;
}

.aroma-step-num{

    display:inline-flex;

    justify-content:center;

    align-items:center;

    width:34px;

    height:34px;

    margin-bottom:18px;

    border-radius:50%;

    background:#8A6245;

    color:#fff;

    font-size:16px;

    font-weight:700;
}

.aroma-step h3{

    margin:0 0 16px;

    font-size:24px;

    color:#2F221B;
}

.aroma-step p{

    margin:0;

    font-size:17px;

    line-height:1.8;

    color:#6B5B4F;
}

/* 화살표 */

.aroma-arrow{

    margin-top:82px;

    font-size:34px;

    color:#B78A61;

    flex-shrink:0;
}
@media (max-width:767px){

    .conO{

        padding:90px 0;
    }

    .aroma-process{

        display:flex;

        flex-direction:column;

        gap:50px;
    }

    .aroma-process-photo{

        width:100%;

        height:340px;
    }

    .aroma-process-content .aroma-title-box{

        text-align:center;

        margin-bottom:45px;
    }

    /* 전체 */

    .aroma-process-list{

        display:flex;

        flex-direction:column;

        align-items:center;

        gap:28px;

        width:100%;
    }

    /* 카드 */

    .aroma-step{

        width:100%;

        max-width:320px;

        display:flex;

        flex-direction:column;

        align-items:center;

        text-align:center;

        padding:0;
    }

    .aroma-step-icon{

        width:74px;

        height:74px;

        margin:0 auto 18px;
    }

    .aroma-step-num{

        width:34px;

        height:34px;

        margin-bottom:18px;

        font-size:16px;
    }

    .aroma-step h3{

        margin:0 0 12px;

        font-size:28px;

        line-height:1.3;

        text-align:center;
    }

    .aroma-step p{

        margin:0;

        font-size:17px;

        line-height:1.8;

        text-align:center;
    }

    /* 화살표 */

    .aroma-arrow{

        margin:0;

        transform:rotate(90deg);

        font-size:34px;

        color:#B78A61;

        line-height:1;
    }

}
/*====================================
conO
====================================*/
.conO{
    padding:90px 0px;
}

.conO .container{
    max-width:1320px;
}

.aroma-process{

    background:#3b261d;
    border-radius:18px;

    display:flex;
    gap:60px;

    padding:60px;
}

.process-photo{

    width:370px;
    flex-shrink:0;
}

.process-photo img{

    width:100%;
    height:100%;

    object-fit:cover;
    border-radius:12px;

    display:block;
}

.process-content{

    flex:1;

    color:#fff;
}


.process-content .aroma-title{

    display:flex;
    align-items:flex-start;
    gap:24px;

    margin-bottom:45px;
}

.process-content .aroma-num{

    font-size:76px;
    line-height:1;
    margin-left: 40px;

    color:#f4ede5;

    font-family:"Cormorant Garamond",serif;
}

.process-content h2{

    margin:0;

    font-size:34px;
    line-height:1.7;


    color:#fff;
}



/* 과정 */

.process-list{

    display:flex;
    align-items:flex-start;
    justify-content:space-between;
}

.process-item{

    width:220px;

    text-align:center;
}

.process-icon{

    width:92px;
    height:92px;

    margin:0 auto 24px;

    border-radius:50%;

    background:#f8f1ea;

    display:flex;
    justify-content:center;
    align-items:center;
}

.process-icon i{

    font-size:40px;
    color:#9a744d;
}

.process-item h3{

    margin:0 0 14px;

    font-size:20px;
    color:#d1b59a;
}

.process-item p{

    margin:0;

    font-size:14px;
    line-height:1.5;

    color:#d7d3cf;
}

.process-arrow{

    align-self:70px;

    font-size:26px;
    margin-top: 30px;

    color:#b58a63;
}
/* =====================================================
   conO Mobile
===================================================== */

@media (max-width:767px){

.conO{
    padding:60px 18px;
}

.aroma-process{

    display:flex;
    flex-direction:column;

    gap:28px;

    padding:24px 20px;

    border-radius:18px;
}

/* 사진 */

.process-photo{

    width:100%;
}

.process-photo img{

    width:100%;
    height:220px;

    object-fit:cover;

    border-radius:14px;
}

/* 제목 */

.process-content .aroma-title{

    gap:16px;
    margin-bottom:28px;
}

.process-content .aroma-num{

    font-size:42px;
    margin-left: 0;
    margin-bottom: 20px;
}

.process-content h2{

    font-size:22px;
    line-height:1.3;
}

.process-content .title-line{

    width:70px;
    margin-top:16px;
}

/* 단계 */

.process-list{

    display:flex;
    flex-direction:column;

    gap:18px;
}

.process-item{

    width:100%;
}

.process-icon{

    width:74px;
    height:74px;

    margin:0 auto 14px;
}

.process-icon i{

    font-size:30px;
}

.process-item h3{

    font-size:20px;
    margin-bottom:10px;
}

.process-item p{

    font-size:14px;
    line-height:1.6;
    margin-bottom: 20px;
}

/* 화살표 ↓ */

.process-arrow{

    align-self:center;

    transform:rotate(90deg);

    font-size:24px;

    margin:-4px 0;
}

}



/*====================================
conP
====================================*/

.conP{
    position:relative;
    overflow:hidden;

    padding:160px 0 90px;

    background:url(img/a1.png) center center / cover no-repeat;
}

.conP::before{
    content:"";
    position:absolute;
    inset:0;

    background:rgba(0,0,0,.40);

    z-index:1;
}

.conP .container{
    position:relative;
    z-index:2;

    max-width:1200px;
    margin:auto;
    padding:0 60px;
}



/* 제목 */

.conP .aroma-title-box{

    text-align:center;
    font-size: 24px;
    color: var(--bright-color);
    padding-bottom:40px;
}

.aroma-title-box .aroma-num{
    color: #e8daaf;
}


/* 카드 */

.aroma-benefit{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;
}

.aroma-benefit-card{


	background: rgba(46, 46, 46, 0.25);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(12px);

	box-shadow: 0 8px 24px rgba(0,0,0,.15);

    border-radius:28px;

    padding:50px 36px;

    text-align:center;

    border:0.5px solid #7e6e60;

    transition:.35s;
}

.aroma-benefit-card:hover{

    transform:translateY(-8px);

    box-shadow:0 25px 55px rgba(0,0,0,.08);
}


/* 아이콘 */

.aroma-benefit-icon{
    width:90px;
    height:90px;
    border-radius:50%;
    background:#F5E4CF;

    display:flex;
    justify-content:center;
    align-items:center;

    margin:0 auto 30px;
}

.aroma-benefit-icon i{
    font-size:40px;
    color:#A47B52;
}

/* 제목 */

.aroma-benefit-card h3{

    margin:0 0 18px;

    font-size:28px;

    color:#e3b58b;
}


/* 설명 */

.aroma-benefit-card p{

    margin:0;

    font-size:14px;

    line-height:1.9;

    color:#ece4df;
}

@media (max-width:767px){

.conP{

    padding:100px 0;
}

.conP .aroma-title-box{

    margin-bottom:55px;
}

.aroma-benefit{

    grid-template-columns:1fr;

    gap:22px;
}

.aroma-benefit-card{

    padding:40px 28px;

    border-radius:22px;
}

.aroma-benefit-icon{

    width:72px;

    height:72px;

    margin-bottom:22px;

    background:linear-gradient(
        145deg,
        #F4E6D5,
        #DFC6A8
    );

}

.aroma-benefit-card h3{

    font-size:20px;

    margin-bottom:14px;
}

.aroma-benefit-card p{

    font-size:15px;

    line-height:1.2;
}

}


/*====================================
conQ
====================================*/

.conQ{

    padding:140px 0 180px;

    background-image: url(img/bbgp.png);
}

.conQ .container{

    max-width:1200px;

    margin:auto;

    padding:0 20px;
}


/* 배너 */

.aroma-cta{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:60px;

    padding:70px 80px;

    border-radius:34px;

    background:linear-gradient(
        135deg,
        #6D4C37,
        #3A2A21
    );

    color:#fff;

    overflow:hidden;

    position:relative;
}


/* 은은한 원 */

.aroma-cta::before{

    content:"";

    position:absolute;

    width:420px;

    height:420px;

    border-radius:50%;

    background:rgba(255,255,255,.05);

    right:-140px;

    top:-120px;
}


/* 텍스트 */

.aroma-cta-text{

    position:relative;

    z-index:2;
}

.aroma-cta-text h3{

    margin:0 0 18px;

    font-size: 24px;
    line-height:1.3;
    color:#fff;
}

.aroma-cta-text p{

    margin:0;

    font-size:19px;

    line-height:1.8;

    color:#E6D8CB;
}


/* 버튼 */

.aroma-cta-btn{

    display:flex;

    gap:18px;

    position:relative;

    z-index:2;
}

.aroma-btn{

    display:flex;

    justify-content:center;

    align-items:center;

    width:220px;

    height:60px;

    border-radius:999px;

    text-decoration:none;

    font-size:17px;

    font-weight:600;

    transition:.35s;
}


/* 밝은 버튼 */

.aroma-light{

    background:#fff;

    color:#3A2A21;
}

.aroma-light:hover{

    background:#EFE3D6;
}


/* 어두운 버튼 */

.aroma-dark{

    border:1px solid rgba(255,255,255,.35);

    color:#fff;

    background:rgba(255,255,255,.08);

    backdrop-filter:blur(10px);
}

.aroma-dark:hover{

    background:rgba(255,255,255,.18);
}

@media (max-width:767px){

.conQ{

    padding:90px 0 120px;
}

.aroma-cta{

    flex-direction:column;

    align-items:flex-start;

    gap:36px;

    padding:48px 28px;

    border-radius:24px;
}

.aroma-cta::before{

    width:220px;

    height:220px;

    right:-80px;

    top:-60px;
}

.aroma-cta-text{

    width:100%;
}

.aroma-cta-text h3{

    font-size:30px;

    line-height:1.35;
}

.aroma-cta-text p{

    margin-top:12px;

    font-size:16px;

    line-height:1.8;
}

.aroma-cta-btn{

    width:100%;

    flex-direction:column;

    gap:14px;
}

.aroma-btn{

    width:100%;

    height:54px;

    font-size:16px;
}

}









/*=========================================================
=======================================================
=======================================================
=======================================================
=======================================================
=======================================================
=======================================================
=======================================================
*/



/*============================================================================
conR Message Board
============================================================================*/

.conR{

	padding:120px 20px 100px;

	background:
	url(img/mbg.png)
	center top
	/ 100% auto
	no-repeat;

	background-color:#F4E9DA;

}

.conR .container{

	max-width:1200px;

	margin:auto;

}

/*============================================================================
Header
============================================================================*/

.message-head{

	max-width:560px;

	margin-bottom:70px;

}

.message-category{

	display:block;

	margin-bottom:18px;

	font-size:16px;

	font-weight:600;

	color:#A67846;

}

.message-title{

	margin:0;

	font-size:54px;

	line-height:1.15;

	color:#231815;

}

.message-desc{

	margin-top:24px;

	font-size:20px;

	line-height:1.8;

	color:#6B5A4B;

}

/*============================================================================
Layout
============================================================================*/

.message-layout{

	display:flex;

	align-items:flex-start;

	gap:42px;

}

/*============================================================================
Mobile
============================================================================*/

@media (max-width:767px){

.conR{

	padding:80px 16px;

}

.message-head{

	margin-bottom:40px;

}

.message-title{

	font-size:34px;

}

.message-desc{

	font-size:15px;

	line-height:1.8;

}

.message-layout{

	flex-direction:column;

	gap:28px;

}

}

/*============================================================================
Input
============================================================================*/


/*==========================================================
Message Layout
==========================================================*/

.message-layout{
    display:flex;
    align-items:flex-start;
    gap:40px;

    margin-top:70px;
}



/*==========================================================
Write Card
==========================================================*/

.message-write{

    width:520px;

    padding:40px;

    background:#FCF9F6;

    border-radius:28px;

    box-shadow:
        0 15px 40px rgba(90,60,25,.18);

    box-sizing:border-box;
}



/*==========================================================
Head
==========================================================*/

.write-head{

    display:flex;
    align-items:center;

    gap:24px;

    margin-bottom:42px;
}

.write-icon{

    width:90px;
    height:90px;

    flex-shrink:0;

    border-radius:50%;

    background:#F2DFC9;

    display:flex;
    justify-content:center;
    align-items:center;

    color:#C49458;

    font-size:42px;
}

.write-title{
    flex:1;
}

.write-title h3{

    margin:0 0 8px;

    font-size:30px;
    font-weight:700;

    color:#5A3923;
}

.write-title p{

    margin:0;

    font-size:15px;
    line-height:1.6;

    color:#7C634F;
}



/*==========================================================
Input
==========================================================*/

.input-box{
    margin-bottom:34px;
}

.input-box:last-of-type{
    margin-bottom:38px;
}

.input-box label{

    display:block;

    margin-bottom:14px;

    font-size:18px;
    font-weight:700;

    color:#5A3923;
}

.input-box input,
.input-box textarea{

    width:100%;

    background:#fff;

    border:1px solid #E3CDB5;

    border-radius:18px;

    font-size:17px;

    color:#3D2B20;

    box-sizing:border-box;

    transition:.25s;
}



/* 이름 */

.input-box input{

    height:62px;

    padding:0 22px;
}



/* 메시지 */

.input-box textarea{

    height:270px;

    padding:20px 22px;

    resize:none;

    line-height:1.8;
}



/* placeholder */

.input-box input::placeholder,
.input-box textarea::placeholder{

    color:#C6AF98;
}



/* focus */

.input-box input:focus,
.input-box textarea:focus{

    outline:none;

    border-color:#B8844E;

    box-shadow:
        0 0 0 4px rgba(184,132,78,.10);
}



/*==========================================================
Count
==========================================================*/

.text-count{

    margin-top:12px;

    text-align:right;

    font-size:14px;

    color:#9B7D61;
}



/*==========================================================
Button
==========================================================*/

.submit-btn{

    width:100%;
    height:76px;

    border:none;

    border-radius:18px;

    background:#6B452C;

    color:#fff;

    font-size:22px;
    font-weight:700;

    cursor:pointer;

    transition:.3s;
}

.submit-btn:hover{

    background:#805237;
}

.submit-btn:active{

    transform:translateY(1px);
}

/*============================================================================
Message Mobile
============================================================================*/

@media (max-width:767px){

/* 섹션 */

.conR{
    padding:120px 16px;
}


/* 헤더 */

.message-head{
    margin-bottom:40px;
    text-align:center;
}

.message-category{
    font-size:12px;
}

.message-title{
    font-size:30px;
    line-height:1.2;
    margin:14px 0 12px;
}

.message-desc{
    font-size:14px;
    line-height:1.7;
}


/* 레이아웃 */

.message-layout{

    display:flex;

    gap:28px;

    margin-top:0;
}


/* 입력 카드 */

.message-write{

    width:100%;

    padding:28px 22px;

    border-radius:22px;
}


/* 상단 */

.write-head{

    gap:16px;

    margin-bottom:30px;
}

.write-icon{

    width:64px;
    height:64px;

    font-size:28px;
}

.write-title h3{

    font-size:24px;

    margin-bottom:6px;
}

.write-title p{

    font-size:13px;

    line-height:1.6;
}


/* 입력 */

.input-box{

    margin-bottom:24px;
}

.input-box label{

    margin-bottom:10px;

    font-size:16px;
}

.input-box input{

    height:54px;

    padding:0 18px;

    font-size:15px;

    border-radius:14px;
}

.input-box textarea{

    height:190px;

    padding:18px;

    font-size:15px;

    border-radius:14px;
}

.text-count{

    margin-top:8px;

    font-size:12px;
}


/* 버튼 */

.submit-btn{

    height:58px;

    border-radius:14px;

    font-size:18px;
}

}

/*==================================================
Message Card
==================================================*/
/*==================================================
Preview Board
==================================================*/

.preview-board{

    flex:1;

    min-width:0;
}


/*------------------------------------
Header
------------------------------------*/

.preview-header{

    display:flex;

    justify-content:space-between;

    align-items:flex-end;

    margin-bottom:18px;
}

.preview-title h3{

    margin-top: 8px;

    font-size:28px;

    color:#33251D;

    font-weight:600;
}

.preview-title p{

    font-size:18px;

    color:#8E7A68;

    line-height:1.0;
}


/*------------------------------------
Refresh
------------------------------------*/

.preview-refresh{

    display:flex;

    align-items:center;

    gap:8px;

    padding:10px 18px;

    border:none;

    border-radius:999px;

    background:#976d3a;

    color:#f6eee9;

    font-size:14px;

    font-weight:600;

    cursor:pointer;

    transition:.25s;
}

.preview-refresh:hover{

    background:#b98854;
}

.preview-refresh i{

    transition:.3s;
}

.preview-refresh:hover i{

    transform:rotate(180deg);
}


/*------------------------------------
List
------------------------------------*/

.preview-list{

    display:grid;

    grid-template-columns:repeat(2,minmax(260px,1fr));

    gap:22px;
}


/*------------------------------------
Card
------------------------------------*/

.preview-card{

    display:flex;
    flex-direction:column;

    height:100px;

    flex-direction:column;

    justify-content:flex-start;

    height:160px; 

    padding:24px 24px;

    background:#fff;

    border:1px solid #EFE5DA;

    border-radius:18px;

    box-shadow:0 8px 22px rgba(70,45,25,.08);

    transition:.25s;
}

.preview-card:hover{

    transform:translateY(-4px);

    box-shadow:0 15px 30px rgba(70,45,25,.14);
}


/*------------------------------------
Top
------------------------------------*/

.preview-head{

    display:flex;

    align-items:center;

    margin-bottom:14px;
}

/*------------------------------------
Name
------------------------------------*/

.preview-name{

    display:flex;

    justify-content:center;

    align-items:center;

    height:26px;

    padding:0 14px;

    border-radius:999px;

    background:#F4E4D2;

    color:#6C452C;

    font-size:12px;

    font-weight:700;
}


/*------------------------------------
Time
------------------------------------*/

.preview-time{

    margin-left:auto;

    font-size:13px;

    color:#9A8774;

    white-space:nowrap;
}


/*------------------------------------
Text
------------------------------------*/

.preview-text{

    flex:1;

    scrollbar-width:none;

    margin-top: 10px;
    margin-left: 5px;

    overflow-y:auto;

    word-break:keep-all;

    line-height:1.2;

    padding-right:6px;

    overflow-y:auto;
    overflow-x:hidden;

    white-space:pre-wrap;
    overflow-wrap:anywhere;
    word-break:break-word;
}

/*======================================
SCROLL BAR
=======================================*/
.preview-text::-webkit-scrollbar{

    width:6px;
}

.preview-text::-webkit-scrollbar-thumb{

    background:#e7dacb;

    border-radius:999px;
}

.preview-text::-webkit-scrollbar-track{

    background:transparent;
}

.preview-text{

    scrollbar-width:none;   /* Firefox */
}

.preview-text::-webkit-scrollbar{

    width:0;
}

.preview-card:hover .preview-text{

    scrollbar-width:thin;
}

.preview-card:hover .preview-text::-webkit-scrollbar{

    width:6px;
}

.preview-card:hover .preview-text::-webkit-scrollbar-thumb{

    background:#D8C1A7;
    border-radius:999px;
}

.preview-card:hover .preview-text::-webkit-scrollbar-track{

    background:transparent;
}

/* ==========================================================
   Message Page Mobile
========================================================== */

@media (max-width:767px){

    /* 전체 */
    .conR{
        padding:90px 20px 70px;
    }

    .message-head{
        margin-bottom:40px;
    }

    .message-title{
        font-size:30px;
        line-height:1.2;
    }

    .message-desc{
        font-size:15px;
        line-height:1.5;
    }

    /* ===========================================
       입력 + 미리보기
    =========================================== */

    .message-layout{

        display:flex;

        flex-direction:column;

        gap:40px;
    }

    /* ===========================================
       입력창
    =========================================== */

    .message-write{

        width:100%;

        max-width:none;

        padding:26px;

        box-sizing:border-box;
    }

    .write-head{
        margin-bottom:24px;
    }

    .write-icon{

        width:72px;
        height:72px;
    }

    .write-icon i{
        font-size:30px;
    }

    .write-title h3{
        font-size:22px;
    }

    .write-title p{
        font-size:13px;
    }

    .input-box{
        margin-bottom:22px;
    }

    .input-box label{
        font-size:15px;
    }

    .input-box input{

        height:54px;

        font-size:15px;
    }

    .input-box textarea{

        height:170px;

        font-size:15px;
    }

    .submit-btn{

        height:58px;

        font-size:18px;
    }

    /* ===========================================
       미리보기
    =========================================== */

    .preview-title h3{

    margin-top: 20px;

    font-size: 24px;

    font-weight:800;
    }

    .preview-title p{

    font-size:18px;
    padding-top: 0;

    }

    .preview-board{

        width:100%;
    }

    .preview-header{

        margin-bottom:22px;

        align-items:flex-end;
    }


    .preview-title p{
        font-size:13px;
    }

    /*------------------------------------
Refresh
------------------------------------*/

.preview-refresh{
     padding:8px 10px;
    font-size:10px;
    margin-bottom: 50px;
}
.preview-time{


    font-size:10px;

}
/*------------------------------------
Name
------------------------------------*/

.preview-name{

    display:flex;

    justify-content:center;

    align-items:center;

    height:20px;

    padding:5px 5px;

    font-size:10px;

    font-weight:700;
}

    /* ===========================================
       카드
    =========================================== */

    .preview-list{

        display:grid;

        grid-template-columns:repeat(2,1fr);

        gap:14px;
    }

    .preview-card{

        width:100%;

        height:180px;

        padding:18px;

        border-radius:18px;

        box-sizing:border-box;
    }

    .preview-head{

        margin-bottom:14px;
    }

    .preview-name{

        padding:0px 10px;

        font-size:11px;
    }

    .preview-time{

        font-size:12px;
    }

    .preview-text{

        height:104px;

        margin:0;

        font-size:14px;

        line-height:1.2;

        white-space:pre-wrap;

        word-break:break-word;

        overflow-wrap:anywhere;

        overflow-y:auto;

        overflow-x:hidden;

        text-align:left;
    }

    /* 모바일에서는 스크롤바 */

    .preview-text::-webkit-scrollbar{
        display:none;
    }

    .preview-text{
        scrollbar-width:none;
    }

    .conR{

    background-image:none;

    background:#F7F1E8;

    }

}




/*==================================================
conS
==================================================*/

.conS{

    margin-top:65px;

    padding:120px 120px;

    background:#F8F2EA;
}

/* 타이틀이 있다면 */
.conS .section-title{

    text-align:center;

    margin-bottom:70px;
}

.conS .section-title h2{

    font-size:46px;

    color:#2A1C14;

    margin-bottom:12px;
}

.conS .section-title p{

    font-size:17px;

    color:#8D8075;
}


/* 카드 목록 */

.gift-wrap{

    display:flex;

    flex-direction:column;

    gap:42px;
}


/* 카드 */

.gift-card{

    background:#fff;

    border:1px solid #EFE3D7;

    border-radius:28px;

    box-shadow:0 16px 40px rgba(70,45,25,.08);

    transition:.35s;
}

.gift-card:hover{

    transform:translateY(-6px);

    box-shadow:0 24px 55px rgba(70,45,25,.12);
}


/* 내부 */

.gift-content{

    display:flex;

    align-items:center;

    gap:70px;

    padding:60px;
}


/* 텍스트 */

.gift-text{

    flex:1;
}

.gift-num{

    display:block;

    font-family:'Cormorant Garamond',serif;

    font-size:66px;

    line-height:1;

    color:#C3A076;
}

.gift-sub{

    display:block;

    margin-top:8px;

    font-size:13px;

    letter-spacing:.18em;

    color:#A88A65;
}

.gift-text h2{

    margin:26px 0 18px;

    font-size:42px;

    color:#2A1C14;
}

.gift-text p{

    font-size:18px;

    line-height:1.8;

    color:#5F534B;
}

.gift-text small{

    display:block;

    margin-top:10px;

    font-size:14px;

    color:#8D8075;
}


/* 이미지 */

.gift-image{

    flex:0 0 430px;

    display:flex;

    justify-content:center;

    align-items:center;
}

.gift-image img{

    display:block;

    width:100%;

    border-radius:22px;

    box-shadow:0 12px 35px rgba(0,0,0,.08);

    transition:.35s;
}

.gift-card:hover .gift-image img{

    transform:scale(1.03);
}


/*==================================================
Mobile
==================================================*/

@media (max-width:767px){

.conS{

    margin-top:70px;

    padding:70px 20px;
}

.gift-wrap{

    gap:28px;
}

.gift-content{

    flex-direction:column;

    gap:34px;

    padding:34px 26px;
}

.gift-text{

    width:100%;

    text-align:center;
}

.gift-num{

    font-size:48px;
}

.gift-sub{

    font-size:12px;
}

.gift-text h2{

    margin:18px 0 14px;

    font-size:30px;
}

.gift-text p{

    font-size:15px;

    line-height:1.8;
}

.gift-text small{

    margin-top:18px;

    font-size:13px;
}

.gift-image{

    width:100%;

    flex:none;
}

.gift-image img{

    width:100%;

    max-width:420px;

    border-radius:18px;
}

}


/* =========================================================
   주최 기관 / 지원 기관
   ========================================================= */

.Plus {
    width: 100%;
    padding: 110px 0 120px;
    background-color: #f3e4d5;
}

.Plus .container {
    width: 1200px;
    margin: 0 auto;
}


/* 제목 */
.Plus .conB-title {
    width: 100%;
    margin-bottom: 55px;
    text-align: center;
}

.Plus .conB-title h2 {
    margin: 0;
    color: #2b1c11;
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.04em;
}


/* 기관 로고 영역 */
.Plus .logo-img {
    width: 100%;
    min-height: 190px;

    display: flex;
    justify-content: center;
    align-items: center;

    padding: 40px 60px;

    background-color: #fffaf5;
    border-radius: 24px;

    box-sizing: border-box;

    box-shadow: 0 12px 30px rgba(70, 45, 28, 0.08);
}


/* 로고 */
.Plus .logo-img img {
    display: block;

    width: auto;
    max-width: 420px;
    max-height: 110px;

    object-fit: contain;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .Plus .container {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    .Plus .logo-img {
        width: 80%;
        margin-left: auto;
        margin-right: auto;

        display: flex;
        justify-content: center;
        align-items: center;
    }

    .Plus .logo-img img {
        display: block;
        margin: 0 auto;
    }

}