@charset "utf-8";

/*=========================================================
	root
=========================================================*/
:root {
  /*Fonts */
  --font-size-0: 2.5rem; /*48px*/
  --font-size-1: 1.9rem; /*30px*/
  --font-size-2: 1.563rem; /*25px*/
   --font-size-3: 1.375rem; /*22px*/
  --font-size-4: 1.125rem; /*18px*/
  --font-size-5: 1rem; /*16px*/
  --font-size-6: 0.875rem; /*14px*/
}

:root {
  /* Colors */
  --color-black: #000000;
  --color-dark-1: #111111;
  --color-dark-2: #262626;
  --color-dark-3: #333333;
  --color-dark-4: #555555;
  --color-light-1: #f9f9f9;
  --color-white: #ffffff;
  --color-light-2: #f2f1ed;
  --color-light-3: #f7f6f3;
  --color-light-4: #f1e9db;
  --color-light-5: #fcfaef;
  --color-gray-1: #434343;
  --color-gray-2: #cccccc;
  --color-gray-3:rgba(224, 224, 224, 1);
  --color-gray-4:rgba(0, 0, 0, 0.4);
  --color-gray-5:rgba(224, 224, 224, 1);
  --color-purple-1: #7300f0;
  --color-blue-1:#0e91d1;
  --color-navy:#00081b;
  --color-navy-1:#001c81;
  --color-navy-2:#00119e;
  --color-gold-1:#97785c;
  --color-orange:#f39939;
  --color-blue:#2aadeb;
  --color-green:#1c3127;
  --color-beige:#f3e7d1;
  --color-brown:#87582c;
  --color-yellow:#e2cb71;
}
.color-black {
	color: var(--color-black)!important;
}
.color-gray-1 {
	color: var(--color-gray-1)!important;
}
.color-gray-2 {
	color: var(--color-gray-2)!important;
}
.color-gray-3 {
	color: var(--color-gray-3)!important;
}
.color-gray-4 {
	color: var(--color-gray-4)!important;
}
.color-gray-5 {
	color: var(--color-gray-5)!important;
}
.color-dark-1 {
	color: var(--color-dark-1)!important;
}
.color-dark-2 {
	color: var(--color-dark-2)!important;
}
.color-dark-3 {
	color: var(--color-dark-3)!important;
}
.color-dark-4 {
	color: var(--color-dark-4)!important;
}
.color-purple-1{
	color: var(--color-purple-1)!important;
}
.color-gold-1{
	color: var(--color-gold-1)!important;
}
.color-white{
	color: var(--color-white)!important;
}
.color-orange{
	color: var(--color-orange)!important;
}
.color-green{
	color: var(--color-green)!important;
}
.color-beige{
	color: var(--color-beige)!important;
}
.bg-black {
  background-color: var(--color-black) !important;
}
.bg-navy {
  background-color: var(--color-navy) !important;
}
.bg-dark-1 {
  background-color: var(--color-dark-1) !important;
}

.bg-dark-2 {
  background-color: var(--color-dark-2) !important;
}

.bg-dark-3 {
  background-color: var(--color-dark-3) !important;
}

.bg-dark-4 {
  background-color: var(--color-dark-4) !important;
}

.bg-light-1 {
  background-color: var(--color-light-1) !important;
}

.bg-light-2 {
  background-color: var(--color-light-2) !important;
}

.bg-light-3 {
  background-color: var(--color-light-3) !important;
}

.bg-light-4 {
  background-color: var(--color-light-4) !important;
}
.bg-light-5 {
  background-color: var(--color-light-5) !important;
}
.bg-light-6 {
  background-color: #f9f9f9 !important;
}

.bg-light-7 {
  background-color: #f3f3f3 !important;
}

.bg-blue-1 {
  background-color: var(--color-blue-1) !important;
}

.bg-white {
  background-color: #fff !important;
}


.font-size-0 {
	font-size: var(--font-size-0) !important;
	font-weight:700;
	line-height:1.25;
	font-family: 'YUniverse-B';
}
.font-size-1 {
	font-size: var(--font-size-1) !important;
	color:#333;
	line-height:1.45;
}
.font-size-2 {
	font-size: var(--font-size-2) !important;
	line-height:1.45;
}
.font-size-3 {
	font-size: var(--font-size-3) !important;

}
.font-size-4 {
	font-size: var(--font-size-4) !important;
}
.font-size-5 {
	font-size: var(--font-size-5) !important;
}
.font-size-6 {
	font-size: var(--font-size-6) !important;
}

.bold{font-weight:600 !important}




.main{background:var(--color-beige); }
/*=========================================================
	header
=========================================================*/
#wrap{overflow:hidden; margin:0 auto; position:relative; max-width:2560px; }
#header{width:100%;  position:fixed;left:0;top:0;width:100%;z-index:50; letter-spacing:-0.5px; transition:all ease-out 300ms ; }
#header.wh{background: var(--color-green); height:4rem;}
#header:hover{ background-color:var(--color-green); }
#header .in{ position:relative; max-width:1920px; margin:0 auto; }
#header .logo .logo-off{display:none;}

#header .logo { width: 200px;  position:absolute; left:50px; top:20px; -webkit-transition: .1s ease-in-out all;transition: .1s ease-in-out all; }
#header .logo a {display: block; width: 100%; height: 100%;}
#header .logo img{max-width:100%}
#header.wh .logo{top:10px}


#header .nav-bg {position: absolute; width: 100%; height: 0px; bottom: 0; left: 0; transform: translateY(100%); transition: 0.4s ease-in-out }
#header.menu-open .nav-bg {height: 350px; background-color: var(--color-white); border:var(--color-dark-2) transparent transparent transparent;transition: 0.4s ease-in-out 150ms}

/*pc gnb*/
.gnb-overlay-bg{display:none; position:fixed; top:0rem;left:0; width:100%; height:100%; background:rgba(0,0,0,0.9); z-index:10;}	
#header #gnb{  -webkit-transition: .3s ease-in-out all;transition: .3s ease-in-out all;}
#gnb > ul{width:100%; text-align:center}
#gnb > ul > li{display:inline-block; position: relative; font-size:0; vertical-align:top; word-break:keep-all; }
#gnb > ul > li > a{position:relative; z-index:10; display:block; height:5rem;font-size:0.9rem; font-weight:600; line-height:5rem; padding:0 2rem; text-align:center; font-family: 'NanumSquareNeo-Variable'; color:#fff;-webkit-transition: .1s ease-in-out all;transition: .1s ease-in-out all; }
#header.wh #gnb > ul > li > a{height:4rem; line-height:4rem;}
#gnb > ul > li.on > a{color:var(--color-beige) !important;  }
#gnb > ul > li.on > a:hover{color:var(--color-beige) !important;  }
#gnb > ul > li.on > a:before{display:block; content:""; width:8px; height:8px; border-radius:50%; background:var(--color-beige); position:absolute; right:20%; top:20%;}

#header.wh #gnb > ul > li.on > a:before{right:15%; top:15%}
#gnb > ul > li > a.subcolor{color:#fff !important; }
#gnb > ul > li.on > a.subcolor{color:var(--color-beige) !important}
#header:hover #gnb > ul > li > a.subcolor{color:var(--color-beige); !important; }
#header:hover #gnb > ul > li > a{color:var(--color-beige);}

#gnbBg{
	position:absolute; left:0; top:100px;  width:100%; height:0;z-index:10;
	-webkit-transition:height 0.3s; -moz-transition:height 0.3s; -o-transition:height 0.3s;-ms-transition:height 0.3s; transition:height 0.3s;
}

#gnbBg.open{width:100%;height:4.5rem; background: var(--color-green);}
#header.wh #gnbBg.open{margin-top:-20px}
#gnb.total-menu > ul > li .gnb-2dep{
	visibility:hidden;
	opacity:0;
	filter:Alpha(opacity=0);
	position:absolute; 
	left:0;
	top:4rem; 
	z-index:10;
	width:100%; 
	padding:0 0;
	text-align:left; 
	-webkit-transition:all 0s 0s;
	-moz-transition:all 0s 0s;
	-o-transition:all 0s 0s;
	-ms-transition:all 0s 0s;
	transition:all 0s 0s;
}
#header.wh #gnb.total-menu > ul > li .gnb-2dep{top:3rem; }

#gnb.total-menu > ul > li .gnb-2dep.show{
	visibility:visible; 
	opacity:1.0;filter:Alpha(opacity=100); 
	-webkit-transition:all 0.3s 0.1s;
	-moz-transition:all 0.3s 0.1s;
	-o-transition:all 0.3s 0.1s;
	-ms-transition:all 0.3s 0.1s;
	transition:all 0.3s 0.1s
}
.gnb-2dep-inner{}
#header.wh .gnb-2dep-menu-list{margin-top:20px}
.gnb-2dep-menu-list{ margin-right: -500px; margin-left: -500px; margin-top:20px; text-align: center; }
.gnb-2dep-menu-list ul{display: -webkit-box;  display: -ms-flexbox; display: flex;  justify-content: center; align-item: center; }
.gnb-2dep-menu-list li{opacity:0; transition: all .6s; transform: translateX(50px); margin: 0 0 0 60px;} 
.gnb-2dep-menu-list ul:hover li{opacity:1;  transform: translateX(0); }
.gnb-2dep-menu-list ul li:first-child {margin: 0;}
.gnb-2dep-menu-list ul li:nth-child(2){transition-delay: .02s;}
.gnb-2dep-menu-list ul li:nth-child(3){transition-delay: .04s;}
.gnb-2dep-menu-list ul li:nth-child(4){transition-delay: .06s;}
.gnb-2dep-menu-list ul li:nth-child(5){transition-delay: .08s;}
.gnb-2dep-menu-list ul li:nth-child(6){transition-delay: .10s;}
.gnb-2dep-menu-list ul li:nth-child(7){transition-delay: .12s;}
.gnb-2dep-menu-list ul li:nth-child(8){transition-delay: .14s;}
.gnb-2dep-menu-list ul li:nth-child(9){transition-delay: .16s;}
.gnb-2dep-menu-list ul li:nth-child(10){transition-delay: .18s;}
.gnb-2dep-menu-list li a {display: block; font-size: 16px; line-height: 93px; color: #ffffff; opacity: .4; transition: all .3s; }
.gnb-2dep-menu-list li a:hover {opacity: 1;}
#gnb > ul > li.on .gnb-2dep-menu-list {z-index: 1; visibility: visible;}
#gnb > ul > li.on .gnb-2dep-menu-list li {opacity: 1; transform: translateX(0);}


/*all*/
#header .header_ui .m_btn{width:50px; text-align: center; position:absolute; right:50px; top:-2px; z-index:9999999}
#header.wh .header_ui .m_btn{top:-10px;}
#header .header_ui .m_btn .icon{display:inline-block; vertical-align: top; position:relative; width: 55px; height: 55px; margin: 23px 0; cursor: pointer;}
#header .header_ui .m_btn .icon span{display:inline-block; position:relative; width: 24px; height: 2px; background: #fff; margin: 27px 0 26px; transition:0.3s}
#header .header_ui .m_btn .icon span::after{content:''; position:absolute; top: -7px; right: 0; background: #fff; height: 2px; width: 24px; transition:0.3s}
#header .header_ui .m_btn .icon span::before{content:''; position:absolute; top: 7px; left: 0; background: #fff; height: 2px; width: 24px; transition:0.3s}

#header:hover .header_ui .m_btn .icon span{background: var(--color-beige);}
#header:hover .header_ui .m_btn .icon span:after{background: var(--color-beige);}
#header:hover .header_ui .m_btn .icon span:before{background: var(--color-beige);}
#header .all_gnb{display:none; position:fixed; top: 0; left: 0; width: 100%; height: 100vh; background: #fff; z-index:999999}
#header .all_gnb .flex_box{display:flex; flex-wrap:wrap;}
#header .all_gnb .left{background:url("../images/common/bg_sky.jpg") 50% 50% no-repeat; display:flex; align-items:flex-end; width: 37.23125327739906%; height: 100vh;  box-sizing:border-box; padding-left: 110px; padding-bottom:134px;} 
#header .all_gnb .left .box > ul{display:flex; align-items:center; margin: 70px 0;}
#header .all_gnb .left .box > ul > li{margin-right: 28px;}
#header .all_gnb .left .box > ul > li:last-of-type{margin-right: 0;}
#header .all_gnb .left .box .all_info ul li{font-family: 'Roboto', sans-serif; font-size:18px; letter-spacing:0.025em; color: #222;}
#header .all_gnb .left .box .all_info .copy{font-family: 'Roboto', sans-serif; font-size:14px; letter-spacing:0.025em; color: #fff; line-height: 1.5; margin-top: 28px;}
#header .all_gnb .scroll_ctn{display:flex; align-items:center; width: 62.76874672260094%; height: 100vh; box-sizing:border-box; padding-left: 150px;}
#header .all_gnb .right{width: 100%;}
#header .all_gnb .right > ul > li{position:relative; margin: 0 0 20px 0;}
#header .all_gnb .right > ul > li > a{display:inline-block; position:relative; font-size:2rem; font-weight:400; letter-spacing:-2px;text-transform: uppercase; }
#header .all_gnb .right > ul > li > a i{display:none; }
#header .all_gnb .right > ul > li.on ul{border-left:solid 1px #dadada}
#header .all_gnb .right > ul > li > ul{display:none; margin-top: 20px; width: calc(100% - 250px); box-sizing:border-box; padding-left:50px}
#header .all_gnb .right > ul > li > ul > li > a{display:inline-block; width: 100%; vertical-align: top; font-size:1rem; font-weight:400; letter-spacing:0.03em; padding: 10px 0; box-sizing:border-box;}
#header.on::after{opacity: 1;  transition:0.3s 0.2s}
#header.on .gnb_bg{transition:0.8s}
#header.on .gnb > ul > li > a{color: var(--color-orange); }
#header .gnb > ul > li:hover > a::after{width: 100%;}
#header .header_ui .m_btn .icon:hover span::after{width: 12px;}
#header .header_ui .m_btn .icon:hover span::before{width: 12px;}
#header .header_ui .m_btn .icon.on span{background: transparent;}
#header .header_ui .m_btn .icon.on span::after{top: 0; transform:rotate(-45deg); background:var(--color-green) !important}
#header .header_ui .m_btn .icon.on span::before{top: 0; transform:rotate(45deg); background:var(--color-green) !important}
#header .header_ui .m_btn .icon.on:hover span::after{width: 24px;}
#header .header_ui .m_btn .icon.on:hover span::before{width: 24px;}
#header.color .gnb > ul > li > a{color: #222;}
@media screen and (max-width:1700px) {
	#header:hover .deps-1 > li > a{padding:0 20px; }
}
@media screen and (max-width:1700px) {
	#header .slogen {display:none}
	#header .pc-nav { left:auto; right:-200px; top:0 ; }
}
@media screen and (max-width:1350px) {
	#header #gnb{display:none}
}
@media screen and (max-width:1200px) {
	#header .logo{left:20px}
	#header .all_gnb .left{display:none}
	#header .all_gnb .right > ul > li{display:block}
	#header .all_gnb .right > ul > li > a{margin-bottom:0;}
	#header .all_gnb .scroll_ctn{padding-left:50px;}
	#header .all_gnb .right > ul > li > ul > li > a{padding:5px 0 0 30PX; }
	#header .all_gnb .right > ul > li > ul {padding-left:0;width: calc(100% - 100px); margin-top:0}
	#header .all_gnb .right > ul > li{margin-bottom:20px}
}
@media screen and (max-width:768px) {
	.main{ }
	#header.wh{height:80px}
	#header .logo {width:150px;}
	#header.wh .logo {top:15px}
	#header .in{height:80px;}
	#header.wh .header_ui .m_btn{top:5px}
	#header .header_ui .m_btn{width:70px;  height:70px; right:0; top:10px}
	#header .all_gnb .right > ul > li.on > a{margin-bottom:20px}
	#header .header_ui .m_btn .icon{margin:7px 0}
	#header .all_gnb .right > ul > li > ul{width:100%}
}


/*pop*/
.main-popup-wrap {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99999;
	transition:0.3s;
}
.main-popup {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    max-width: calc(100vw - 30px);
    width: 1260px;
    max-width: calc(100vw - 30px);
}
#hd_pop { 
	display: flex;
    justify-content: center;
    align-items: center;
	z-index:999999999;
}
.hd_pops_con{
	padding:0 15px;
}
.hd_pops_con img {
    /*min-width:350px;*/
    /*max-height: 370px;*/
    max-width: 100%;
    width:100%;
}
.main-popup-btm {
    display: flex;
    height: 32px;
}
.main-popup-close-wrap {
    display: flex;
    justify-content: space-between;
    width: 100%;
}
.main-popup-close-wrap>label {
    cursor: pointer;
    color: var(--color-white);
    height: 100%;
    font-size: 13px;
    display: flex;
    align-items: center;
    position: relative;
}
.main-popup-close-wrap>label>input {
    margin-right: 3px;
}
.main-popup-close-wrap>label>i {
    font-size: 1.2em;
    margin: 0 3px -2px 0;
    z-index: 1;
}
.main-popup-close {
    background:none;
    height: 100%;
    font-size: 13px;
    margin-left: auto;
    color:#fff;
	max-width:0;
}
.main-popup-bg {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    background: rgba(0, 0, 0, .65);
}
@media screen and (max-width:1200px) {
   
	.main-popup {
        width: 700px;
    }
    .main-popup-btm {
        height: 27px;
    }
    .main-popup-close {
        border-radius: 19px;
        font-size: 12px;
        margin-left: 7px;
    }
    .main-popup-close-wrap>label {
        border-radius: 19px;
        font-size: 12px;
    }
    .swiper-pagination-popup {
        border-radius: 19px;
        font-size: 12px;
    }
    .main-popup-close-wrap>label>i {
        font-size: 1.1em;
        margin: 0 1px -2px 0;
    }
}

@media screen and (max-width:768px) {

    .main-popup {
        width: 340px !important;
    }
    .popup-wrap2 {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 99999;
    }
    .popup-wrap2 .main-popup {
        width: 100% !important;
    }
	#hd_pop { 
	display:block;
    justify-content: center;
    align-items: center;
	z-index:999999999;
	}
    .hidden {
        overflow-y: hidden;
    }
}

@media screen and (max-width:340px) {
    .main-popup {
        width: 100% !important;
    }

}

/* visual */
#visual{position:relative;z-index:9;width:100%;height:100vh;}
#visual>div{width:inherit;height:inherit}
#visual .swiper-wrapper,
#visual .swiper-container{width:100%;height:100%;}
#visual .swiper-slide{position:relative;overflow:hidden; }
#visual .swiper-slide .bg{
	position:absolute;left:0;top:0;
	width:100%;height:100%;
	transform:scale(1.1);
}
#visual .swiper-slide-active{}
#visual .swiper-slide-active .bg{animation:visualBg both ease-in-out 5s;}
/*keyframes*/
@keyframes visualBg {
	0% {
		transform:scale(1); 
	}
	100% {
		transform:scale(1.1);
	}
}
#visual .swiper-slide video{
	min-width:100%;min-height:100%;
    position: absolute;top: 0;left: 50%;
    z-index: 1;
    transform: translateX(-50%);
}
#visual .swiper-slide .textwrap{position:absolute;  left:0; right:0; top:0; bottom:30%; top:50%; z-index:100; margin:0 auto; width:1440px; max-width:100%; padding:0 20px; }
#visual .swiper-slide .textwrap h3{
	font-size:3.125rem;
	color:#fff;
	font-weight:400;
	opacity:0;
	transform:translateX(-20px);
	transition:all 1s 1.2s;
}
#visual .swiper-slide .textwrap p{
	font-size:3.125rem;
	color:#fff;
	opacity:0;
	transform:translateX(-20px);
	transition:all 1s 1.6s;
	overflow:hidden;
}
#visual .swiper-slide-active .textwrap h3{opacity:1;transform:translateX(0px);}
#visual .swiper-slide-active .textwrap p{opacity:1;transform:translateX(0px);}
#visual .ctr{position:absolute;  width:1440px; max-width:100%; height:30px;  padding:0 20px;  margin:0 auto; left:0; right:0; bottom:0; bottom:10%;z-index:1000; overflow:hidden;}
#visual .ctr .in{width:150px; height:30px; position:absolute;  bottom:10%; z-index:900; left:20px }
#visual .ctr .in:after{width:1px; height:20px; display:block; content:""; background:#fff; position:absolute; left:0; right:0; bottom:0; top:0; margin:0 auto;}
#visual .vprev{
	position:absolute;
	left:0;
	bottom:0;
	width:1.875rem;
	height:1.875rem;
	background:url(../images/icon/white_arrow_prev_icon.png) left 50% no-repeat;
	background-size:1.5rem;
	cursor:pointer;
	z-index:1000;
}
#visual .vnext{
	position:absolute;
	right:0;
	bottom:0;
	width:1.875rem;
	height:1.875rem;
	background:url(/theme/cafe2/images/icon/white_arrow_next_icon.png) right 50% no-repeat;
	background-size:1.5rem;
	cursor:pointer;
	z-index:1000;
}
#visual .swiper-pagination{
	position:absolute; left:0; right:0; bottom:0; top:0px; margin:0 auto; 
	color:#fff
}
#visual .swiper-pagination span{
	display:inline-block;
	position:relative;
}

@media screen and (max-width:1400px) {
	#visual .ctr{bottom:10%; width:100%;}
	#visual .swiper-slide .textwrap{width:100%;}
	}
@media screen and (max-width:768px) {
	#visual .ctr{bottom:10% }
	#visual .ctr .in{width:150px; height:30px; margin:0 auto; left:0; right:0; bottom:0; top:0}
	#visual .swiper-pagination{top:5px;}
	#visual .swiper-slide .textwrap{ bottom:20%; }
	#visual .swiper-slide .textwrap h3{font-size:2rem;}
	#visual .swiper-slide .textwrap p{font-size:2rem;}
}




/* ======================================================================== */
/* tit size*/
/* ======================================================================== */
.con{padding-bottom:8rem}
.con:nth-child(1){padding-top:8rem}
.con:last-child{padding-bottom:8rem}

@media screen and (max-width:768px) {
	.con{padding-bottom:5rem}
	.con:nth-child(1){padding-top:5rem}
	.con:last-child{padding-bottom:5rem}
}



/* ======================================================================== */
/* 1. Contents-1 ¼ö¸ñ¿ø ¼Ò°³*/
/* ======================================================================== */
#mainCon1{
	background:url("/theme/cafe2/images/main/bg_leaf_patten.jpg") no-repeat;  
	position:relative; 
}
#mainCon1:after{content:''; display:block; clear:both;}
#mainCon1 .titWrap{margin-bottom:4rem; color:var(--color-green); position:relative; z-index:10; }
#mainCon1 .titWrap .font-size-0{ font-family: 'YUniverse-B' !important}
#mainCon1 .titWrap .font-size-3{ font-family: 'YUniverse-B' !important}
#mainCon1 .titWrap .h5{font-weight:400; margin-bottom:40px;}
#mainCon1 .back-leaf{}
#mainCon1 .back-leaf .leaf-01{position:absolute; left:0; top:-20%; z-index:10;  }
#mainCon1 .back-leaf .leaf-02{position:absolute; right:0; top:-40%; z-index:10;}
#mainCon1 .back-leaf .leaf-03{position:absolute; left:30%; top:20%; z-index:11; opacity:0.8}

.main-bs-con .bs-box-list{position:relative; clear:both}
.main-bs-con .bs-box-list li{float:left; width:40%; max-width:40rem; position:relative; z-index:9;}

.main-bs-con .bs-box-list.pc li:nth-child(2n-1){margin-right:10%}
.main-bs-con .bs-box-list.pc li.box-01{margin-top:3%}
.main-bs-con .bs-box-list.pc li.box-02{margin-top:-24%}
.main-bs-con .bs-box-list.pc li.box-03{margin-top:10%}
.main-bs-con .bs-box-list.pc li.box-04{margin-top:5.8%}
.main-bs-con .bs-box-list.pc li.box-01 .bg-img{border-radius:0 60px 0 0; width:110%; margin-left:-70px; cursor:pointer;}
.main-bs-con .bs-box-list.pc li .bg-img{position:relative; display:block; width:100%; padding-top:110%; overflow:hidden; /* box-shadow:10px 15px 22px 5px rgba(0,0,0,0.09); */border-radius:60px 0 0 0; transition:opacity 1.1s}
.main-bs-con .bs-box-list.pc li .bg-img span{position:absolute; top:0; left:0; width:100%; height:100%; transition:all 0.2s}
.main-bs-con .bs-box-list.pc li .bg-img img{position:absolute; left:0; width:100%; /*top:0;  height:100%*/top:0; height:auto; transition:transform 2.6s cubic-bezier(.19,1,.22,1);}
.main-bs-con .bs-box-list.pc li.box-01 .txt{bottom:-45%; }
.main-bs-con .bs-box-list.pc li.box-01 .txt dt{color:var(--color-green); margin-bottom:45px}
.main-bs-con .bs-box-list.pc li.box-01 .txt dd{}
.main-bs-con .bs-box-list li .txt{position:absolute; bottom:10%;  padding:0 3rem}
.main-bs-con .bs-box-list li .txt dt{font-size: var(--font-size-1); letter-spacing:-0.06rem; margin-top:2rem; color:#fff;}
.main-bs-con .bs-box-list li .txt dd{font-weight:200; font-size:1.5rem; letter-spacing:0;  text-transform:uppercase;}

@media screen and (max-width:1400px) {
	.main-bs-con .bs-box-list.pc li.box-01 .bg-img{margin-left:0;}
}

@media screen and (max-width:768px) {
	.main-bs-con .bs-box-list li a:hover .bg-img img{transform:scale(1.1)}
	.main-bs-con .bs-box-list li{width:100%; margin-bottom:0; max-width:100%}
	.main-bs-con .bs-box-list.pc li .bg-img{border-radius:0}
	.main-bs-con .bs-box-list.pc li:nth-child(2n-1){margin-right:0}
	.main-bs-con .bs-box-list.pc li.box-01{margin-top:0; }
	.main-bs-con .bs-box-list.pc li.box-02{margin-top:0}
	.main-bs-con .bs-box-list.pc li.box-03{margin-top:0}
	.main-bs-con .bs-box-list.pc li.box-04{margin-top:0}
	.main-bs-con .bs-box-list.pc li.box-01 .bg-img{border-radius:60px 0 0 0 ; width:100%; margin-left:0;}
	.main-bs-con .bs-box-list.pc li.box-01 .txt{ bottom:10%;  padding:0 2rem }
	.main-bs-con .bs-box-list.pc li.box-01 .txt dt{margin:0}
	#mainCon1 .back-leaf{display:none}
	#mainCon1 .btnWrap{position:absolute; top:-7%; right:0%}
	.main-bs-con .bs-box-list li .txt dt{font-size: var(--font-size-2);}
	.main-bs-con .bs-box-list li .txt{padding:0 2rem}

}



/* ======================================================================== */
/* 2. Contents-2 Ä«Æä ¼Ò°³*/
/* ======================================================================== */
#mainCon2{
	background:var(--color-green);  
	background-size:cover;
	position: relative;
    z-index: 2;
}

#mainCon2 .back-leaf{}
#mainCon2 .back-leaf .leaf-01{position:absolute; left:45%; top:-3%; z-index:11;   }
#mainCon2 .back-leaf .leaf-02{position:absolute;  left:45%; top:-5%; z-index:9;}
#mainCon2 .back-leaf .leaf-03{position:absolute;  right:-20px; bottom:10%; z-index:9; }
#mainCon2 .back-leaf .leaf-04{position:absolute;right:-5px; bottom:-9px; z-index:9; }
#mainCon2 .back-leaf .leaf-05{position:absolute; left:55%; top:30%; z-index:10; }
#mainCon2 .back-leaf .leaf-06{position:absolute; right:0; top:40%; z-index:10; }
#mainCon2 .back-leaf .leaf-07{position:absolute; right:5%; bottom:0%; z-index:10; }
#mainCon2 .back-bg{position:absolute; z-index:-1;  width:100%; height:100%; opacity:1}
#mainCon2 .back-bg img{height:1200px}
#mainCon2 .back-bg:before{display:block; content:""; position:absolute;right:0;  z-index:100; width:50%; height:100%; background:var(--color-green); opacity:.9}
#mainCon2 .fix-subject-top {position:relative; color:#c1956b; text-align:left; width:45%; margin:0 auto -5%; z-index:10}
#mainCon2 .fix-subject-top .subject > div{font-size: var(--font-size-0);  font-family: 'YUniverse-B' !important; line-height:1.2}
#mainCon2 .fix-subject-bottom {position:relative; color:#fff; text-align:right; width:45%; margin:0 auto -5%; z-index:10}
#mainCon2 .fix-subject-bottom .subject > div{font-size: var(--font-size-5); margin-top:2rem; font-weight:300; opacity:.5 }

#mainCon2 .fix-subject .btnWrap{position:absolute; left:0; bottom:-20%; right:0;  margin:0; z-index:10}
#mainCon2 .in{
     display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 100%;
    position: relative;
	justify-content: space-between;
    z-index: 2;
	position:relative;
}

#mainCon2 .photo_view_content{width:50%;}
#mainCon2  .smbn_wrap{ width:100%; position:relative;  text-align:center; margin:7.5rem auto 0}
.smbn_con{ position:relative; margin:0 auto; }
.smbn_wrap .mbn_swiper1 {  
	min-width:250px; 
	max-width:420px; 
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center; 
}

.mbn_swiper1 .swiper-wrapper{align-items: flex-start;  }
.mbn_swiper1 .swiper-slide {width:100%;   overflow:hidden}
.mbn_swiper1 .text_box{ margin:0 auto; overflow:hidden; position:relative; color:var(--color-dark-1);min-height:350px;}
.mbn_swiper1 .text_box img{/* display:block;*/ width:100%; height:100%;}
.mbn_swiper1 .text_box .thumb_wrapper{ overflow:hidden; border-radius:300px 300px 0 0; min-height:300px; }
.mbn_swiper1 .text_box .thumb_wrapper .thumb_bg{width:100%; min-height:300px; overflow:hidden; opacity:.0; transform:scale(1); transition:all 1s ease-in-out}
.mbn_swiper1 .swiper-slide-active .text_box  .thumb_wrapper .thumb_bg{
	transition:transform 2.6s cubic-bezier(.19,1,.22,1);
	transform:scale(1.1);
	opacity:1 !important
	}
.mbn_swiper1 .text_box .text_area{ width:100%; transition:0.2s ease-in-out; font-size:0.875rem;opacity:1;}
.sw_con2 .swiper-pagination-fraction{display:none}
.sw_navi{ width:100%; height:100%;z-index:20; position:absolute; left:0; right:0; bottom:0; top:300px; margin:0 auto 0;display:flex; flex-wrap:nowrap; flex-direction:row; align-items:center; justify-content:flex-start; }
.sw_con{ width:40%; position:relative; text-align:center; }
.sw_con i{ display:block; width:100%; height:50px; opacity:.6}
.sw_con i:hover{opacity:1}
.sw_con i.btn_sw_left{background:url(../images/icon/icon_arow_left.png) no-repeat; background-position:40% center; text-indent:-9999px; }
.sw_con i.btn_sw_right{background:url(../images/icon/icon_arow_right.png) no-repeat; background-position:60% center; text-indent:-9999px;}
.sw_con2{ width:20%;position:relative; text-align:center;margin:0 auto;}
.sw_con2 .swiper-pagination-fraction{ width:100%; position:relative; left:0; bottom:0;   height:auto;}
#mainCon2 .bg_view_content{width:50%; text-align:center }
#mainCon2 .bg_view_content img{max-width:100%;}
#mainCon2 .titWrap{color:#fff }
#mainCon2 .titWrap h2{  margin-bottom:-1.5rem; font-weight:100 !important; color:var(--color-beige); font-size:var(--font-size-0); font-family: 'YUniverse-B'; font-weight:600; position:relative; z-index:2}
#mainCon2 .titWrap > div{font-weight:300;}


@media all and (max-width:1300px){
	#mainCon2 .fix-subject .btnWrap{position:inherit; text-align:left; margin-top:40px; margin-left:120px}
}
@media all and (max-width:1200px){
	#mainCon2 .back-bg:before{width:100%; height:30%; bottom:0}
	.mbn_swiper1 .text_box{margin-top:20%}
}

@media all and (max-width:1024px){
	#mainCon2 .in{display:block;}
	#mainCon2 .photo_view_content{width:100%; }
	#mainCon2 .bg_view_content{width:100%; background:url("../images/main/bg_light.jpg");  padding:5rem 0} 
	#mainCon2 .back-bg{display:none}
	#mainCon2 .fix-subject-top{width:85%; margin-bottom:-4rem}
	#mainCon2 .fix-subject-bottom{width:85%}
	.smbn_wrap .mbn_swiper1 { max-width:300px; }
}


@media all and (max-width:768px){
	#mainCon2{margin-top:0; }
	#mainCon2 h2 span{display:block}
	#mainCon2 .back-leaf{display:none}
	#mainCon2 .titWrap {text-align:center; margin:0 auto;}
	#mainCon2 .smbn_wrap{margin:5rem 0 0}
	
	#mainCon2 .titWrap{text-align:center; margin:0 auto; left:0; right:0; bottom:0; top:0; }
	#mainCon2 .titWrap br{display:none}
	#mainCon2 .titWrap h2{margin-bottom:-45px; }
	#mainCon2 .titWrap > div{padding:20px}
	
	.mbn_swiper1 .text_box{min-height:auto}
	.sw_navi{display:none}
	.smbn_wrap .mbn_swiper1{ }
	.mbn_swiper1 .text_box .thumb_wrapper{min-height:auto}
	.mbn_swiper1 .text_box .thumb_wrapper .thumb_bg{min-height:auto}
	.mbn_swiper1 .text_box .thumb_wrapper{border-radius:20rem 20rem 1rem 1rem;}
}

@media all and (max-width:430px){
}


/* ======================================================================== */
/* 3.. Contents-3 ÇÁ·Î±×·¥¼Ò°³*/
/* ======================================================================== */
#mainCon3{
	background:url("/theme/cafe2/images/main/bg_beige_patten.jpg") left top no-repeat;  
	background-size:contain;
	position:relative; 
	padding-top:8rem;
	padding-bottom:16rem
}
#mainCon3 .titWrap{margin-top:50px}
#mainCon3 .titWrap h2{margin-bottom:25px}
#mainCon3 .conWrap{display: -webkit-box;  display: -ms-flexbox; display: flex; justify-content: space-between; align-item: center;flex-wrap: wrap; }
#mainCon3 .conWrap [class*=item-]{ flex: 1 1 30%; padding:0 2rem}
#mainCon3 .conWrap [class*=item-] .img-style{ position:relative}
#mainCon3 .conWrap [class*=item-] .img-style img{max-width:100%}
#mainCon3 .conWrap [class*=item-] .img-style .name{position:absolute; left:0; right:0; top:50%; bottom:0; margin:0 auto; text-align:center; font-size:var(--font-size-2); color:#fff}
#mainCon3 .conWrap [class*=item-] .subtext{color:var(--color-gray-4); font-weight:400; font-size:var(--font-size-5);}

#mainCon3 .conWrap .item-01 .img-style{margin-bottom:20px;}
#mainCon3 .conWrap .item-01 .subtext{text-align:center; }
#mainCon3 .conWrap .item-02{margin-top:7%}
#mainCon3 .conWrap .item-02 .subtext{margin-bottom:20px;}
#mainCon3 .conWrap .item-03 .subtext{margin-top:20px;}
#mainCon3 .conWrap .item-03 .img-style img{max-width:480px}


@media all and (max-width:1500px){	
	#mainCon3 .conWrap .item-03 .img-style img{max-width:100%}
}

@media all and (max-width:1024px){	
	#mainCon3 .conWrap{display:block}
	#mainCon3 .titWrap{margin-top:0; margin-bottom:50px}
	#mainCon3 .conWrap [class*=item-] .img-style{border-radius:0 60px 0 0; overflow:hidden}
	#mainCon3 .conWrap [class*=item-] .img-style:nth-child(even){border-radius:60px 0 0 0; overflow:hidden}
	#mainCon3 .conWrap [class*=item-]{ flex: 1 1 100%;}
	#mainCon3 .pc-view{display:none !important}
	#mainCon3 .mo-view{display:block !important}
	#mainCon3 .conWrap .item-02{margin-top:0}
	#mainCon3 .conWrap .item-02 .subtext{margin-top:20px; margin-bottom:0}
	#mainCon3 .conWrap [class*=item-] .subtext {text-align:left}
	#mainCon3 .conWrap [class*=item-] .subtext br{display:none}
	#mainCon3 .conWrap [class*=item-]{padding:0 0 2rem 0}

}

@media all and (max-width:768px){
	#mainCon3{padding-bottom:5rem; padding-top:5rem}
}


/* ======================================================================== */
/* 4. Contents-4 ¿þµù¿¬È¸*/
/* ======================================================================== */
#mainCon4{
	background:url("/theme/cafe2/images/main/bg_leaf_green_pc.jpg") right top no-repeat;  
	background-size:80%;
	position:relative; 
	margin-top:-8rem;
}
#mainCon4 .innerWrap{
	display: flex; 
	justify-content: space-between; 
	align-item: center;
	flex-wrap: wrap; 
}
#mainCon4 .text-box{position:absolute; right:0; top:28%; z-index:1; text-align:center; color:var(--color-beige)}
#mainCon4 .innerWrap a{display:block;  height:100%;}
#mainCon4 .innerWrap h2{margin-top:40px}
#mainCon4 .innerWrap > div{height:350px; width:50%; }
#mainCon4 .innerWrap > div:hover{}
#mainCon4 .innerWrap > div a > .titWrap{
	text-align:center; 
	display: flex;
	flex-direction: column;
    align-items: center;
	justify-content: center;
	height:100%
	}
#mainCon4 .innerWrap > div a  > .titWrap h2{font-weight:400 !important; 	color:#fff;  margin-bottom:20px}
#mainCon4 .innerWrap > div a  > .titWrap .right-area  p{font-size:var(--font-size-6); font-weight:200 !important; padding-bottom:40px; color:#fff !important; }
#mainCon4 .innerWrap .wedding-box{background:url("/theme/cafe2/images/main/bg_wedding.png") 50% 50% no-repeat;  margin-top:8rem }
#mainCon4 .innerWrap .event-box{background:url("/theme/cafe2/images/main/bg_event.png") 50% 50% no-repeat;  margin-top:25.5rem; }

@media all and (min-width:2000px){
	#mainCon4{background:url("/theme/cafe2/images/main/bg_leaf_green.jpg") 50% top no-repeat;  background-size:auto 33rem;}
	#mainCon4 .innerWrap{max-width:1600px; margin:0 auto;}
	#mainCon4 .text-box{top:14rem; right:-5rem; text-align:left; }
}

@media all and (max-width:1800px){
	#mainCon4{	background-size:auto 33rem;}
}

@media all and (max-width:768px){
	#mainCon4{margin-top:0; padding-top:6rem; background-size: 200%;}
	#mainCon4 .text-box{position:inherit; top:0; height:150px !important;}
	#mainCon4 .innerWrap{padding:0 20px}
	#mainCon4 .innerWrap > div{width:100%; height:250px }
	#mainCon4 .innerWrap .event-box{margin-top:0}
	#mainCon4 .innerWrap > div a  > .titWrap .right-area  p{padding-bottom:20px}
	#mainCon4 .innerWrap h2{margin-top:0}
	#mainCon4 .innerWrap .wedding-box{margin-top:0}
}


/* ======================================================================== */
/* 5. Contents-5 °øÁö °Ô½ÃÆÇ*/
/* ======================================================================== */
#mainCon5{

}
#mainCon5 .titWrap{
	display: flex;
   align-items: flex-end;
	justify-content: space-between;
}
#mainCon5 .titWrap .btnWrap {margin-bottom:10px}

@media all and (max-width:768px){
	#mainCon5 .titWrap{display:block}
	#mainCon5 .titWrap h2{margin-bottom:25px}
}


/* ======================================================================== */
/* 6. Contents-6 °¶·¯¸® °Ô½ÃÆÇ*/
/* ======================================================================== */
#mainCon6{
	background-image:url("/theme/cafe2/images/main/bg_tree_left.png"), url("/theme/cafe2/images/main/bg_tree_right.png");
	background-position: left top, right bottom;
	background-repeat: no-repeat;
	background-size: 30% , 40%;

}
#mainCon6 .back-leaf{}
#mainCon6 .back-leaf .leaf-01{position:absolute; left:0; top:0%; z-index:9999999;  transition:all ease-out 1s 1s !important;}
#mainCon6 .back-leaf .leaf-02{position:absolute; right:0; top:-30%; z-index:999; transition:all ease-out 1s 2s !important;}
#mainCon6 .back-leaf .leaf-03{position:absolute; left:30%; top:20%; z-index:11; opacity:0.8}

#mainCon6 .titWrap{
	display: flex;
   align-items: flex-end;
	justify-content: space-between;
	margin-bottom:70px
}
#mainCon6 .titWrap .btnWrap {margin-bottom:10px}

@media all and (max-width:768px){
	#mainCon6 .titWrap{display:block}
	#mainCon6 .titWrap h2{margin-bottom:25px}
}


/* ======================================================================== */
/* 7. Contents-7 Áöµµ*/
/* ======================================================================== */
#mainCon7{
	background:var(--color-green);
	padding-top:8rem
}
#mainCon7 .titWrap{
	display: flex;
   align-items: flex-end;
	justify-content: space-between;
	margin-bottom:70px;
	color:var(--color-beige);
}
#mainCon7 .titWrap .btnWrap {margin-bottom:10px}
#mainCon7 .titWrap .font-size-5{font-weight:400; opacity:0.5}

@media all and (max-width:768px){
	#mainCon7 .titWrap{display:block}
	#mainCon7 .titWrap h2{margin-bottom:25px}
	#mainCon7 .titWrap h2 span{display:block; margin-top:10px}
}

@media all and (max-width:768px){
	#mainCon7{padding-top:4rem}
}




/* ======================================================================== */
/* footer */
/* ======================================================================== */
.footer {width:100%; padding:4rem 0 4rem; background:url("../images/common/bg_footer.png") center bottom no-repeat; background-size:cover; overflow: hidden; position: relative; }
.footer_layout .btm {; display: flex;}
.footer_layout .btm > * {flex:1;}
.footer .btm .left .img_box {min-width:200px; max-width:450px}
.footer .btm .left .img_box img {opacity: 1;}
.footer .btm .right address {color:rgba(255, 255, 255, 0.6); font-size:1rem; line-height:1.75;font-style:normal}
.footer .btm .right address > span {font-weight: 600;padding-right:10px;}
.footer .btm .right .copy{color:rgba(255, 255, 255, 0.4);font-size:0.875rem; margin-top:20px;}
.footer .btn_top {display:none}

@media all and (max-width:768px){
	.footer .btm .left .img_box {width:300px; margin-bottom:30px}
	.footer_layout .btm {display: block}
	}




/* ======================================================================== */
/* sub */
/* ======================================================================== */

/* --------------- Visual -------------------- */
.visual_area_sub {position:relative; width:100%; margin:0 auto 0;   text-align:center}
.visual_area_sub .subback {position:relative; height:800px; overflow:hidden; width:100%;   padding:0; margin:0 auto; background:#000; }
.visual_area_sub .subback .img{height:800px;  width:100%; animation:visualBg both ease-in-out 3s; opacity:1;  background-size:contain; background-repeat:no-repeat; background-position:50% 50%; opacity:0.9}
.visual_area_sub .pc_wrap {position:absolute; width:100%; top:0; z-index:5; color:#Fff; margin-top:15rem}
.visual_area_sub .pc_wrap .navi {display: flex;  justify-content: space-between;margin-top:2rem}
.visual_area_sub .pc_wrap .navi  .home {display:block; width:1.2rem;height:1.2rem;background:url("../images/icon/icon_home.png") left 50% no-repeat; background-size:1rem; padding-left:1.5rem}
.visual_area_sub .pc_wrap .navi  .position{ display:block;  padding-left:1rem;height:1.2rem;background:url("../images/icon/slide_next.png") 0% 50% no-repeat; background-size:0.3rem;}
.visual_area_sub .pc_wrap .in-a{
    opacity:1;
	overflow:hidden;
	font-size:0;
	height:4.2rem;
	margin-top:1rem
	}
.visual_area_sub .pc_wrap .in-a .text-a{
    animation: txtani-y  0.7s;
    animation-fill-mode: forwards;
    transform: translateY(30px);
    opacity: 0;
	font-weight:200;
	display:inline-block;
	}
.visual_area_sub .pc_wrap .in-b{
    opacity:1;
	overflow:hidden;
	font-size:0;
	height:1.5rem;
	}
.visual_area_sub .pc_wrap .in-b .text-b {
    animation:  txtani-y 0.7s;
    animation-fill-mode: forwards;
    transform: translateY(50px);
    opacity: 0;
	overflow:hidden;
	 font-size:1.3rem;
	 font-weight:400;
	}

.visual_area_sub .pc_wrap .in-b ul li {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    line-height: 1.6;
    vertical-align: middle;
	}
.visual_area_sub .pc_wrap .in-b ul .split-li-wrapper {display: inline-block; vertical-align: middle;}
.visual_area_sub .pc_wrap .in-b ul .post-meta__divider {
    display: inline-block;
    vertical-align: middle;
    margin: 0 0 0.2rem 0;
    width: calc(1 * (40 * 1px));
    height: 1px;
	margin:0 0.5rem;
    background-color: #dadada;
	}
.visual_area_sub .pc_wrap .in-a .delay1{animation-delay:300ms;}
.visual_area_sub .pc_wrap .in-a .delay2{animation-delay:400ms;}
.visual_area_sub .pc_wrap .in-a .delay3{animation-delay:500ms;}
.visual_area_sub .pc_wrap .in-a .delay4{animation-delay:600ms;}
.visual_area_sub .pc_wrap .in-a .delay5{animation-delay:700ms;}
.visual_area_sub .pc_wrap .in-a .delay6{animation-delay:800ms;}
.visual_area_sub .pc_wrap .in-a .delay7{animation-delay:900ms;}
.visual_area_sub .pc_wrap .in-a .delay8{animation-delay:1s;}
.visual_area_sub .pc_wrap .in-a .delay9{animation-delay:1.1s;}
.visual_area_sub .pc_wrap .in-a .delay10{animation-delay:1.2s;}
.visual_area_sub .pc_wrap .in-a .delay11{animation-delay:1.3s;}
.visual_area_sub .pc_wrap .in-a .delay12{animation-delay:1.4s;}
.visual_area_sub .pc_wrap .in-a .delay13{animation-delay:1.5s;}
.visual_area_sub .pc_wrap .in-a .delay14{animation-delay:1.6s;}
.visual_area_sub .pc_wrap .in-a .delay15{animation-delay:1.7s;}
.visual_area_sub .pc_wrap .in-a .delay16{animation-delay:1.8s;}
.visual_area_sub .pc_wrap .in-a .delay17{animation-delay:1.9s;}
.visual_area_sub .pc_wrap .in-a .delay18{animation-delay:2s;}
.visual_area_sub .pc_wrap .in-a .delay19{animation-delay:2.1s;}
.visual_area_sub .pc_wrap .in-a .delay20{animation-delay:2.2s;}

.visual_area_sub .pc_wrap .in-b .delay1{animation-delay:300ms;}
.visual_area_sub .pc_wrap .in-b .delay2{animation-delay:400ms;}
.visual_area_sub .pc_wrap .in-b .delay3{animation-delay:500ms;}
.visual_area_sub .pc_wrap .in-b .delay4{animation-delay:600ms;}
.visual_area_sub .pc_wrap .in-b .delay5{animation-delay:700ms;}
.visual_area_sub .pc_wrap .in-b .delay6{animation-delay:800ms;}
.visual_area_sub .pc_wrap .in-b .delay7{animation-delay:900ms;}
.visual_area_sub .pc_wrap .in-b .delay8{animation-delay:1s;}
.visual_area_sub .pc_wrap .in-b .delay9{animation-delay:1.1s;}
.visual_area_sub .pc_wrap .in-b .delay10{animation-delay:1.2s;}


@keyframes txtani-x {
	form { transform: translateX(-30%); opacity: 0;}
	to { transform: translateX(0); opacity: 1; }
}
@-webkit-keyframes txtani-x {
	form { transform: translateX(-30%); opacity: 0;}
	to { transform: translateX(0); opacity: 1; }
}

@keyframes txtani-y {
	form { transform: translateY(-30px); opacity: 0;}
	to { transform: translateY(0); opacity: 1; }
}
@-webkit-keyframes txtani-y {
	form { transform: translateY(-30px); opacity: 0;}
	to { transform: translateY(0); opacity: 1; }
}
.visual_area_sub .pc_wrap .in .text-b span{display:block;}

@media all and (max-width:1600px){
	.visual_area_sub {padding:0}
	}
@media all and (max-width:1500px){
	.visual_area_sub .pc_wrap .navi {display:none}
	}
@media all and (max-width:1200px){
	}
@media all and (max-width:768px){
	.visual_area_sub {  
	height:250px;
    margin:0 auto 0;
	text-align:center;
	}
	.visual_area_sub .subback{height:250px;}
	.visual_area_sub .pc_wrap .in-a{height:5rem;}
	.visual_area_sub .pc_wrap .in-a .text-a{font-size:1.5rem}
	.visual_area_sub .subback .img{height:250px;  width:100%; margin-left:0;  background-size:50%}
	/*.visual_area_sub .subback{height:30rem; }
	.visual_area_sub .subback .img{background-position:50% 50% !important; height:30rem;}*/
	.visual_area_sub .pc_wrap {margin-top:5.5rem}
	}



/* --------------- sub layout -------------------- */
#container_sub{background:#f9f8f4}
#sub_contents{background:#f9f8f4; padding:7rem 0 7rem;}
#sub_contents img{max-width:100%;}
#sub_contents .con{padding-top:0rem}
@media screen and (max-width:1200px) {
	#sub_contents{padding:5rem 0 5rem;}
}

/* --------------- PC Lnb -------------------- */
.lnb_pc{ width:100%; height:100px;   box-sizing:border-box;  text-align:right;margin-top:0;}
.lnb_pc .inner-1400 {position:relative}
.lnb_pc .inner-1400 > #mysubmenu { position:absolute;left:0; top:-40px; width:2000px ; background:#fff; display:flex;}
.lnb_pc .inner-1400 > #mysubmenu:after {display:block;clear:both;height:0;content:"";overflow:hidden;}
.lnb_pc .inner-1400 > #mysubmenu ul {height: 100px;}
.lnb_pc .inner-1400 > #mysubmenu .list0 .home {border-right:solid 1px #eee}
.lnb_pc .inner-1400 > #mysubmenu .list0 .home a {filter: invert(100%); display:block; width:120px;height:100px;background: url("../images/icon/icon_home.png") 50% 50% no-repeat; background-size:20px; padding-left:30px;}
.lnb_pc .inner-1400 > #mysubmenu li {
	position: relative;
	list-style: none;
	display: inline-block;
	color:var(--color-green);
	}
.lnb_pc .inner-1400 > #mysubmenu li a {
	display: block;
	height: 79px;
	line-height: 100px;
	padding:0 30px;
	text-align:center;
	font-size: 1rem;
	font-weight:500;
	text-transform: uppercase;
	min-width:150px;
	color:var(--color-gray-2);
	}

.lnb_pc .inner-1400 > #mysubmenu li.open a{ font-weight:700; color:var(--color-green);}
.lnb_pc .inner-1400 > #mysubmenu li.open a:before{display:block; content:""; width:8px; height:8px; border-radius:50%; background:var(--color-beige); position:absolute; right:20%; top:30%;}



/* --------------- Mobile Lnb -------------------- */
#lnb {display:none; position: absolute; z-index: 5; WIDTH:100%;height: 80px;}
#lnb .lnb_home{position: absolute; left:0; background: rgba(0,0,0,1); display: block; content: ''; width:calc((100% - 1200px) / 2); height: 80px; text-align: right;transition: all .3s;}
.lnb_home a{display: block; position: relative; box-sizing: border-box; border-right: 1px solid var(--color-green); padding: 0 40px 0 40px; font-size: 0; line-height: 80px; color: #fff;text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden; box-sizing: border-box;}
.lnb_home a.home:before{display: block; content: ''; position: absolute; top: 30px; right: 20px; width:22px; height: 22px; background:url('../images/icon/icon_home.png') no-repeat; background-position: 0 0; transition: all .3s;}
#lnb > ul {width: 100%; max-width: 1200px; margin: 0 auto; font-size: 0; }
#lnb > ul > li {display: inline-block; width:30%;vertical-align: top; overflow: hidden;}
#lnb > ul > li.lnb02{background: var(--color-green);}
#lnb > ul > li.lnb03{background: var(--color-green);}
#lnb > ul > li > a {display: block; position: relative; box-sizing: border-box; border-right: 1px solid var(--color-green); padding: 0 40px 0 40px; font-size: 18px; line-height: 80px; color: #fff; transition: all .3s; text-overflow:ellipsis; white-space:nowrap;word-wrap:normal;overflow:hidden;}
#lnb > ul > li > a:after {display: block; content: ''; position: absolute; top: 30px; right: 40px; width: 25px; height: 25px; background: url(../images/icon/icon_arrow_w.png) 0 0 no-repeat; transition: all .3s;}
#lnb ul li a.home:after, #lnb > ul > li.lnb01:hover > a:after,
#lnb > ul > li.lnb01:focus > a:after{background: none;}
#lnb > ul > li:hover > a:after,
#lnb > ul > li:focus > a:after {transform: rotate(-180deg);}
#lnb > ul > li:hover > a,
#lnb > ul > li:focus > a,
#lnb > ul > li.active > a,
#lnb > ul > li > a.arrow {border-color: var(--color-green); font-weight: 700; color: #ffffff;}
#lnb > ul > li:hover > a:after,
#lnb > ul > li:focus > a:after,
#lnb > ul > li > a.arrow:after {background-image: url('../images/icon/icon_arrow_w.png');}
#lnb > ul > li .depth2 { display: none; height: 0; padding: 0; background: var(--color-green); transition: all .3s;}
#lnb > ul > li .depth2 > li {margin: 10px 0 0; }
#lnb > ul > li .depth2 > li:first-child {margin: 0;}
#lnb > ul > li .depth2 > li > a {display: block; position: relative; font-size: 16px; line-height: 1.5; color: #fff; }
#lnb > ul > li:hover .depth2,
#lnb > ul > li:focus .depth2,
#lnb > ul > li.active .depth2 {height: auto; padding: 15px 15px; display: block;}
#lnb > ul > li .depth2 > li > a:hover,
#lnb > ul > li .depth2 > li > a:focus {font-weight: 700; color: #ffffff;}

@media screen and (max-width:1200px) {
	#lnb{margin-top:0; height:70px;}
	#lnb > ul > li {width:50%;}
	#lnb > ul > li > a{line-height:70px; padding:0 20px; font-size:13px;}
	#lnb > ul > li .depth2 > li > a{ font-size:13px;}
	#lnb .lnb_home{display:none}
	#lnb > ul > li > a:after {top: 25px; right: 20px;}
	#lnb > ul > li > a:after { top: 27px; right: 20px; width: 18px; height: 18px; background: url('../images/common/icon_arrow_w.png') 0 0 no-repeat; background-size:18px;}
}
@media screen and (max-width:1024px) {
	#lnb {display:block;}
	.lnb_pc {display:none}
	}



/* --------------- subConStyle -------------------- */

.title_h2{position: relative;font-size: 2.6rem; text-align:center; color: #000; font-family: 'Montserrat', sans-serif; font-weight: 500;line-height: 1.3; letter-spacing:-2px;word-break: keep-all; margin-top:5rem}
.title_h2:after{display: inline-block;content:"";width: 10px;height: 10px;background:var(--color-green);border-radius: 50%;vertical-align: bottom;margin-bottom:60px;margin-left: 10px;}
/*.title_h2:before{display: block;content:"";position: absolute;top: 50px;right: calc(100% + 39px);width: 100px;height: 1px;background: #434343;}*/


.subConStyle{font-size:1rem; line-height:1.75; }
.subConStyle p{
	font-weight: 500;
    font-size: 1rem;
    line-height: 1.6;
    letter-spacing: -0.05em;
    color: var(--color-gray-1);
}

/*[class*=subConStyle-]{margin-bottom:4rem}
[class*=subConStyle-]:last-child{margin:0}*/
.subConStyle .titBox span{display:block; position:relative; margin-bottom:2rem; padding-left:35px;  line-height:1.2; font-size:1.438rem}
.subConStyle .titBox span:before{position:absolute; left:7.5px;  top:16px;  content:"";  width:15px; height:5px;  background:var(--color-orange); transform:rotate(45deg)}
.subConStyle .titBox span:after{position:absolute; left:0;  top:16px;  content:"";  width:15px; height:5px;  background:var(--color-green); transform:rotate(-45deg)}
.subConStyle .conbox{margin-bottom:4rem}
.subConStyle .conbox:last-child{margin-bottom:0rem}
.subConStyle .t1{margin-bottom:2rem ;font-size:1.125rem; font-weight:600}
.subConStyle h4{margin-bottom:2rem; font-weight:600}
.subConStyle .conbox .img-box img{max-width:100%}

@media screen and (max-width:768px) {
	.title_h2{margin-top:150px}
	.subConStyle .titBox span:before{top:12px; width:12px; left:5px}
	.subConStyle .titBox span:after{top:12px; width:12px;}
}

/* ---------------list style -------------------- */

/* LIST */
ol {color: #333;line-height: 1.5;}
.list-tit {overflow:hidden}
.list-tit > li {float:left;width:50%; display: flex; align-items: baseline;font-size: 1rem;line-height: 1.75;letter-spacing: -0.05em;color: #757575;}
.list-tit > li:not(:last-child) {margin-bottom: 40px;}
.list-tit__tit {display: block;width: 120px;height: 40px;margin-right: 20px;padding: 5px 20px;border: 1px solid #AFAFAF;border-radius: 100px;text-align: center;font-size: 0.875rem;line-height: 1.7;letter-spacing: -0.05em;color: #141414;}

.list-dots {margin-left: 4px;}
.list-dots > li {position: relative;margin-bottom: 6px;padding-left: 15px;font-weight: 400;font-size: 1rem; line-height: 1.6;letter-spacing: -0.05em;color: var(--color-gray-1);}
.list-dots > li::before {content: '';position: absolute;top: 14px;left: 0;width:6px;height:6px;background:  var(--color-yellow);border-radius: 50%;}

.list-bar {margin-left: 4px;}
.list-bar > li {position: relative;margin-bottom: 6px;padding-left: 12px;font-weight: 400;font-size: 1rem;lline-height: 1.6;letter-spacing: -0.05em;color: var(--color-gray-1);}
.list-bar > li::before {content: '';position: absolute;top: 13px;left: 0;width: 6px;height: 1px;background: #757575;border-radius: 50%;}

@media screen and (max-width:768px) {
	.list-tit > li {float:none; width:100%}
	.list-tit > li:not(:last-child) {margin-bottom: 15px;}
	.list-tit__tit{line-height: 2;}
	.list-dots > li::before {top:8px;}


}

/*diagram*/
.diagram-col3 {display: flex;justify-content: space-between; flex-wrap: wrap;}
.diagram-col3__item {flex: 0 0 30%;display: flex; flex-direction: column;  justify-content: center;align-content: center; min-height: 200px;padding: 30px;border: 1px solid #79A8CF;border-radius: 20px; text-align:center} 
.diagram-col3__item .num {display: block;width: 100%;margin-bottom: 15px;font-weight: 700;font-size: 1rem;  color: #79A8CF; text-align:center}
.diagram-col3__item .text {font-size: 1.1rem; line-height: 28px;}

@media screen and (max-width:768px) {
	.diagram-col3__item {flex: 0 0 48%; margin-bottom:4%;/* height:150px*/}	
	.diagram-col5__item:last-child{margin-bottom:0}
}

.diagram-col4 {display: flex;justify-content: space-between; flex-wrap: wrap;}
.diagram-col4__item {flex: 0 0 20%;display: flex; flex-direction: column;  justify-content: center;align-content: center;min-height: 200px;padding: 30px;border: 1px solid #79A8CF;border-radius: 20px; text-align:center} 
.diagram-col4__item .num {display: block;width: 100%;margin-bottom: 15px;font-weight: 700;font-size: 1rem;  color: #79A8CF; text-align:center}
.diagram-col4__item .text {font-size: 1.1rem; line-height: 28px;}

@media screen and (max-width:768px) {
	.diagram-col4__item {flex: 0 0 48%; margin-bottom:4%; height:150px}	
	.diagram-col5__item:last-child{margin-bottom:0}
}

.diagram-col5 {display: flex;justify-content: space-between; flex-wrap: wrap;}
.diagram-col5__item {flex: 0 0 12%;display: flex; flex-direction: column;  justify-content: center;align-content: center;min-height: 200px;padding: 30px;border: 1px solid #79A8CF;border-radius: 20px; text-align:center} 
.diagram-col5__item .num {display: block;width: 100%;margin-bottom: 15px;font-weight: 700;font-size: 1rem;  color: #79A8CF; text-align:center}
.diagram-col5__item .text {font-size: 1.1rem; line-height: 28px;}

@media screen and (max-width:768px) {
	.diagram-col5__item {flex: 0 0 48%; margin-bottom:4%; height:150px}	
	.diagram-col5__item:last-child{margin-bottom:0}
}


.diagram-col6 {display: flex;justify-content: space-between; flex-wrap: wrap;}
.diagram-col6__item {flex: 0 0 15%;display: flex; flex-direction: column;  justify-content: center;align-content: center;min-height: 200px;padding: 30px;border: 1px solid #79A8CF;border-radius: 20px; text-align:center} 
.diagram-col6__item .num {display: block;width: 100%;margin-bottom: 15px;font-weight: 700;font-size: 1rem;  color: #79A8CF; text-align:center}
.diagram-col6__item .text {font-size: 1.1rem; line-height: 28px;}

@media screen and (max-width:768px) {
	.diagram-col6__item {flex: 0 0 48%; margin-bottom:4%; height:150px}	
	.diagram-col6__item:last-child{margin-bottom:0}
}

/*bg 3*/
.diagram-bg {display: flex;justify-content: space-between; flex-wrap: wrap;}
.diagram-bg__item {flex: 0 0 30%;display: flex; flex-direction: column;  justify-content: center;align-content: center;min-height: 200px;padding: 30px;background:#f5faff; border:solid 1px #dfeefd; border-radius: 20px; text-align:center} 
.diagram-bg__item .num {display: block;width: 100%;margin-bottom: 15px;font-weight: 700;font-size: 1rem;  color: #79A8CF; text-align:center}
.diagram-bg__item .text {font-size: 1.1rem; margin-top:20px;}

@media screen and (max-width:768px) {
	.diagram-bg__item {flex: 0 0 48%; margin-bottom:4%; height:auto}	
	.diagram-bg__item:last-child{margin-bottom:0}
}

/*bg 3*/
.diagram-line {display: flex;justify-content: space-between; flex-wrap: wrap;}
.diagram-line__item {flex: 0 0 30%;display: flex; flex-direction: column;  justify-content: center;align-content: center; min-height: 200px;padding: 30px; text-align:center} 
.diagram-line > div + div{border-left:dashed 1px var(--color-gray-3);}
.diagram-line__item .num {display: block;width: 100%;margin-bottom: 15px;font-weight: 700;font-size: 1rem;  color: var(--color-orange); text-align:center}
.diagram-line__item .text {font-size: 1.2rem;  border-bottom:solid 8px #eee; }
.diagram-line__item  p{padding-top:30px;}
@media screen and (max-width:768px) {
	.diagram-line__item {flex: 100%; margin-bottom:4%; height:auto}	
	.diagram-line__item:last-child{margin-bottom:0}
	.diagram-line > div + div{border-left:none !important;  border-top:dashed 1px #dadada;}

}


.bg-gray{border:solid 7px var(--color-gray-3); padding:2rem;}

/*table layout*/
.table-type-1{overflow-x:auto;}
.table-type-1 table {width:100%; border-collapse:collapse; border-top:solid 3px var(--color-brown); font-size: 0.875rem;min-width:700px; }
.table-type-1 table th {padding:13px; text-align:center; border-bottom:solid 1px #325641; background:var(--color-beige); border:solid 1px #dadada;}
.table-type-1 table td {padding:13px; text-align:center; border-bottom:solid 1px #dadada; border:solid 1px #dadada;}
@media screen and (max-width:430px) {

}



/*»çÁøÇü ¸®½ºÆ®*/
.picture-type-list {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	justify-content:beetween;
	align-item: center; 
	text-align:center;
	margin:0 -1rem;
}
.picture-type-list li{
	 margin:0 1rem;
}


.picture-type-list .picture-type-img{ 
	margin-bottom:2rem;
	overflow:hidden;
	text-align:center; 
	border-radius:1.5rem 0 1.5rem 0 ;
	background:#f0f0f0
}
 
.picture-type-list .picture-type-cont > div{
	font-size:1.2rem;
	font-weight:600;
}



@media screen and (max-width:992px) {
	.picture-type-list {flex-wrap: wrap; margin:0 0 0 0;}
	.picture-type-list li{ flex: 1 1 40%; margin:0 0 0 0}
	.picture-type-list > li{margin-bottom:2rem}
	.picture-type-list > li:last-child{margin-bottom:0}
}



/*¶óÀÎ ¸®½ºÆ®*/
.line-type-list {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	justify-content:beetween;
	align-item: center; 
	text-align:center;
	margin:0 -1rem;
}
.line-type-list li{
	 margin:0 1rem;
	 padding:2rem 1.5rem;
	 border:solid 1px #eee;
	 border-radius:1.5rem 0 1.5rem 0 ;
	 box-shadow:0px 30px 40px 0px rgba(000,000,000,0.1);
}
.line-type-list .line-type-icon{ 
	margin-bottom:2rem;
	overflow:hidden;
	text-align:center; 
}
.line-type-list .line-type-cont > div{
	font-size:1.1rem;
	border-bottom:solid 1px #eee;
}
.line-type-list .line-type-cont p{text-align:left; font-size:0.8rem}

@media screen and (max-width:992px) {
	.line-type-list {flex-wrap: wrap; }
	.line-type-list li{ margin:0.5rem}
}



/*±âº»Çü ¸®½ºÆ®*/
.normal-type-list {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	justify-content:center;
	align-item: center; 
	text-align:center;
}
.normal-type-list li{
	padding:0 1.5rem
}
.normal-type-list .normal-type-icon{
	width:4rem; 
	height:4rem;  
	background:#fff; 
	border-radius:10rem; 
	text-align:center; 
	padding-top:1rem;
	box-shadow:0px 30px 40px 0px rgba(000,000,000,0.1);
	margin:0 auto 2rem;
	overflow:hidden;
}

.normal-type-list .normal-type-icon img{width:2rem;}

.normal-type-list .normal-type-cont > div{
	font-size:1.1rem;
}

@media screen and (max-width:430px) {
	.normal-type-list li{
	padding:0 1rem 1.5rem 1rem;
	}
}


/*¼ýÀÚ+¾ÆÀÌÄÜ ¸®½ºÆ®*/
.num-type-list {
    display: flex;
	align-items: center;
	align-content:center;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
	justify-content: center; 
}
.num-type-item {
    position: relative;
    width: calc(50% - 3rem);
    padding-left: 10rem;
}
.num-type-item:nth-child(2n) {
    margin-left: 4rem;
}

.num-type-item:before {
    content: "";
    display: block;
    position: absolute;
    top: 0.3rem;
    left: 4.5rem;
    width: 5rem;
    height: 100%;
    background-repeat: no-repeat;
    background-position: left 50%;

}

.num-type-item.num-type-item-1:before {
    background-image: url('/theme/cafe2/images/sub/icon_cleaning.png');
}
.num-type-item.num-type-item-2:before {
     background-image: url('/theme/cafe2/images/sub/icon_care.png');
}
.num-type-item.num-type-item-3:before {
    background-image: url('/theme/cafe2/images/sub/icon_smoking.png');
}
.num-type-item.num-type-item-4:before {
   background-image: url('/theme/cafe2/images/sub/icon_squirrel.png');
}
.num-type-item.num-type-item-5:before {
    background-image: url('/theme/cafe2/images/sub/icon_cloud.png');
}
.num-type-item.num-type-item-6:before {
    background-image: url('/theme/cafe2/images/sub/icon_leaf.png');
}
.num-type-item:nth-child(2) ~ .num-type-item {
    margin-top: 3rem;
}
.num-type-number {
    position: absolute;
    top: 1rem;
	left:0;
    color: var(--color-brown);
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.388;
    letter-spacing: -0.04em;
	text-align:center;
	 display: flex;
	align-items: center;
	align-content:center;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
	justify-content: center; 
}
.num-type-number:before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0rem;
    left: 0;
    width: 100%;
    height:0.188rem;
    background-color:var(--color-brown);
}
.num-type-key {
    margin-bottom: 10px;
    line-height: 1.5;
    letter-spacing: -0.04em;
	font-size:var(--font-size-4);
}
.num-type-value {
    color: #54555A;
    font-size: 0.8rem;
    line-height: 1.625;
    letter-spacing: -0.04em;
    word-break: keep-all;
}

@media screen and (max-width:992px) {
	.num-type-list{display:block}
	.num-type-item{width:100%; margin-bottom:2rem; padding-left:5rem}
	.num-type-item br{display:none}
	.num-type-item:nth-child(2n) {margin-left: 0;}
	.num-type-item:before {background-size:3rem; left:0}
	.num-type-item:nth-child(2) ~ .num-type-item{margin-top:0}
	.num-type-number{font-weight:600; display:none}
	.num-type-number:before{bottom:0}
}




/*¼ýÀÚÇü ¸®½ºÆ®*/
.num02-type-list {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-lines: multiple;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.num02-type-item {
    position: relative;
    width: calc(50% - 3rem);
    padding-left: 7rem;
	margin-bottom:2rem;
}
.num02-type-item:nth-child(2n) {
    margin-left: 4rem;
}

.num02-type-number {
    position: absolute;
    top: 0.5rem;
    left: 0;
    color: #fff;
    font-size: 2rem;
    text-align: left;
    font-weight: 700;
    line-height: 1.388;
    letter-spacing: -0.04em;
	border-radius:5rem;
	background:#398CC9;
	width:3rem;
	height:3rem;
	text-align:center;
}

.num02-type-key {
    margin-bottom: 10px;
    color: #0C2340;
    font-size: 1rem;
    line-height: 1.5;
    font-weight: 900;
    letter-spacing: -0.04em;
}
.num02-type-value {
    color: #54555A;
    font-size: 0.8rem;
    line-height: 1.625;
    letter-spacing: -0.04em;
    word-break: keep-all;
}

@media screen and (max-width:992px) {
	.num02-type-list{display:block}
	.num02-type-item{width:100%; margin-bottom:2rem}
	.num02-type-item br{display:none}
	.num02-type-item:nth-child(2n) {margin-left: 0;}
	.num02-type-item:nth-child(2) ~ .num02-type-item{margin-top:0}
	.num02-type-number{font-weight:600}
	.num02-type-number:before{bottom:0}
}




.titWrap .tit h3{display:inline-block; position:relative; color:#333 }
.titWrap .tit h3:before{display:inline-block; content:""; width:20px; height:6px; background: var(--color-green); margin-bottom:7px; margin-right:10px}
.titWrap .tit i{padding-left:10px; margin-top:-20px; display:none}



/* --------------- subCon1_Àλ縻 -------------------- */
.subCon1{background:url(/theme/cafe2/images/sub/img_leaves.png) center bottom no-repeat; padding-bottom:8rem; margin-bottom:-8rem}
.subCon1 .flex{ 
    display: flex;
    justify-content:center;
}
.subCon1 .flex .img-box{position:relative; padding-right: 3rem; width:50%}
.subCon1 .flex .img-box .slogen{position:absolute; top: calc(50% - 200px); right:0; bottom:0; left:20%; margin:0 auto; font-size:2rem; font-weight:600;}
.subCon1 .flex .text-box{position:relative;  width:50%; }
.subCon1 .flex .text-box .font-size-2{ font-weight:500}
.subCon1 .flex .text-box .name{ font-weight:500}
@media screen and (max-width:768px) {
	.subCon1{background:none}
	.subCon1 .flex{display:block}
	.subCon1 .flex .img-box{width:100%; padding:0 0 3rem 0}
	.subCon1 .flex .text-box{width:100%; }
}


/* --------------- subCon1-2_ÇöȲ -------------------- */

/* --------------- subCon3_¼ö¸ñ¿ø »ç°è -------------------- */
.subCon1-2{position:relative}
.subCon1-2 .inner-1400 {}
.subCon1-2 .inner-1400 .flex{}
.subCon1-2 .inner-1400 .flex {
	margin-bottom:4rem;
	padding-bottom:4rem
}
.subCon1-2 .inner-1400 .flex .titWrap .font-size-1{font-weight:700; color:#947b58}
.subCon1-2 .inner-1400 .flex .text-box{
	display: flex;
	align-items: center;
	align-content:center;
	justify-content: space-between;
	}
.subCon1-2 .inner-1400 .conWrap .con-top{display: flex; align-items: center; justify-content: space-between; flex-wrap:wrap;  position:relative; z-index:20}

.subCon1-2 .inner-1400 .conWrap .con-top .text-box{width:40%;}
.subCon1-2 .inner-1400 .conWrap .con-top .text-box .tit{font-size:2rem; font-weight:600 !important; margin-bottom:2rem; color:var(--color-green) }
.subCon1-2 .inner-1400 .conWrap .con-top .text-box .subtext{ font-size:var(--font-size-6); }
.subCon1-2 .inner-1400 .conWrap .con-top .text-box .kind {margin-bottom:1rem; color:var(--color-gray-1)}
.subCon1-2 .inner-1400 .conWrap .con-top .text-box .kind span{display:inline-block; background:var(--color-green); color:#fff;font-size: var(--font-size-6); padding:10px; border-radius:10px; margin-bottom:10px}
.subCon1-2 .inner-1400 .conWrap .con-top .text-box .kind > div{ font-size:var(--font-size-6); }

.subCon1-2 .inner-1400 .conWrap .img-box{}
.subCon1-2 .inner-1400 .conWrap .img-box img{position:relative; border-radius:30px; z-index:1; }
.subCon1-2 .inner-1400 .conWrap [class*=con-photo-]{
	display: flex;
	align-items: center;
	align-content:center;
	justify-content: space-between;
	}
.subCon1-2 .inner-1400 .conWrap [class*=con-photo-] {margin-top:2rem}
.subCon1-2 .inner-1400 .conWrap [class*=con-photo-] .text-box{letter-spacing:-1px; color: var(--color-gray-1)!important;}

.subCon1-2 .inner-1400 .conWrap [class*=con-photo-]  .con-top{display:block !important}
.subCon1-2 .inner-1400 .conWrap [class*=con-photo-]  .con-top .text-box{width:100%}

.subCon1-2 .inner-1400 .conWrap .con-photo-1 .img-box{width:50%; margin-right:4rem; position:relative}
.subCon1-2 .inner-1400 .conWrap .con-photo-1 .img-box:after{display:block; content:""; position:absolute; left:-10%; bottom:-10%; z-index:0; width:100%; height:100%; background:#eee; border-radius:30px}

.subCon1-2 .inner-1400 .conWrap .con-photo-1 .text-box{width:50%; }

.subCon1-2 .inner-1400 .conWrap .con-photo-2 .img-box{width:50%; position:relative;}
.subCon1-2 .inner-1400 .conWrap .con-photo-2 .img-box:after{display:block; content:""; position:absolute; right:-10%; bottom:-10%; z-index:0; width:100%; height:100%; background:#eee; border-radius:30px}

.subCon1-2 .inner-1400 .conWrap .con-photo-2 .text-box{width:50%;  margin-right:4rem}

.subCon1-2 .inner-1400 .conWrap .con-1{position:relative; margin-bottom:10rem}
.subCon1-2 .inner-1400 .conWrap .con-2{position:relative; margin-bottom:10rem}
.subCon1-2 .inner-1400 .conWrap .con-3{position:relative; margin-bottom:10rem}
.subCon1-2 .inner-1400 .conWrap .con-4{position:relative; margin-bottom:10rem}
.subCon1-2 .inner-1400 .conWrap .con-5{position:relative; margin-bottom:10rem}
.subCon1-2 .inner-1400 .conWrap .con-6{position:relative; margin-bottom:10rem}
.subCon1-2 .inner-1400 .conWrap .con-7{position:relative; margin-bottom:10rem}
.subCon1-2 .inner-1400 .conWrap .con-8{position:relative; margin-bottom:10rem}




@media screen and (max-width:768px) {
	.subCon1-2 .inner-1400 .conWrap br{display:none}
	.subCon1-2 .inner-1400 .conWrap .con-top{margin-bottom:2rem}
	.subCon1-2 .inner-1400 .conWrap .con-top .text-box{width:100%;  margin-bottom:2rem}
	.subCon1-2 .inner-1400 .conWrap [class*=con-photo-]{ }
	.subCon1-2 .inner-1400 .conWrap [class*=con-photo-]  .con-top{margin-bottom:-2rem !important; }
	.subCon1-2 .inner-1400 .conWrap .con-photo-1 {flex-direction:column-reverse}
	.subCon1-2 .inner-1400 .conWrap .con-photo-1 .img-box{width:100%}
	.subCon1-2 .inner-1400 .conWrap .con-photo-1 .img-box{margin-right:0}
	.subCon1-2 .inner-1400 .conWrap .con-photo-1 .text-box{width:100%; margin-bottom:2rem}
	.subCon1-2 .inner-1400 .conWrap .con-photo-1 .img-box:after{display:none}

	.subCon1-2 .inner-1400 .conWrap .con-photo-2 {flex-direction: column;}
	.subCon1-2 .inner-1400 .conWrap .con-photo-2 .img-box{width:100%;}
	.subCon1-2 .inner-1400 .conWrap .con-photo-2 .text-box{width:100%; margin-right:0; margin-bottom:2rem}
	.subCon1-2 .inner-1400 .conWrap .con-photo-2 .img-box:after{display:none}


	.subCon1-2 .inner-1400 .conWrap .con-1{ margin-bottom:5rem}
	.subCon1-2 .inner-1400 .conWrap .con-2{ margin-bottom:5rem}
	.subCon1-2 .inner-1400 .conWrap .con-3{ margin-bottom:5rem}
	.subCon1-2 .inner-1400 .conWrap .con-4{ margin-bottom:5rem}
	.subCon1-2 .inner-1400 .conWrap .con-5{ margin-bottom:5rem}
	.subCon1-2 .inner-1400 .conWrap .con-6{ margin-bottom:5rem}
	.subCon1-2 .inner-1400 .conWrap .con-7{ margin-bottom:5rem}
	.subCon1-2 .inner-1400 .conWrap .con-8{ margin-bottom:5rem}

}


/* --------------- subCon1-3_¿À½Ã´Â±æ -------------------- */
.subCon1-3{}
.subCon1-3 .inner-1400{margin-bottom:3rem}

/* --------------- subCon3_¼ö¸ñ¿ø ¾È³»µµ -------------------- */
.subCon2-1{position:relative}
.subCon2-1 .inner-1400{padding-bottom:3rem }
.subCon2-1 .inner-1400 .flex{ 
}
.subCon2-1 .inner-1400 .flex > div{
	display: flex;
   justify-content:space-between;
}
.subCon2-1 .inner-1400 .flex .titWrap{

}
.subCon2-1 .inner-1400 .flex .titWrap .simbol{display:none; padding-left:3rem; margin-left:3rem; border-left:solid 1px rgba(000,000,000,0.1);}
.subCon2-1 .inner-1400 .flex .titWrap .font-size-1{font-weight:700}
.subCon2-1 .inner-1400 .flex .text-box .sub-text {max-width:60%; width:100%; font-size:1.1rem}
.subCon2-1 .inner{z-index:1}
.subCon2-1 .inner > div{margin:6rem 0}
.subCon2-1 .back-bg{position:absolute; z-index:0;  width:100%; height:500px; overflow:hidden}
.subCon2-1 .back-bg img{height:1000px;}
.subCon2-1 .back-leaf .leaf-01{position:absolute; left:0; top:-20%; z-index:1;  }
.subCon2-1 .back-leaf .leaf-02{position:absolute; right:0; top:-10%; z-index:1;}
.subCon2-1 .back-leaf .leaf-03{position:absolute; left:17%; top:8%; z-index:2; opacity:0.8}

.subCon2-1 .inner .video{
	position: relative;
    padding-top: 50%;
    width: 100%;
    height: 0;
	}
	.subCon2-1 .inner .video > iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	}

@media screen and (max-width:1200px) {
	.subCon2-1 .back-leaf{display:none}
	.subCon2-1 .inner-1400 .flex .text-box .sub-text{max-width:100%; margin-left:0}
	.subCon2-1 .inner-1400 .flex .text-box .sub-text br{display:none}
	.subCon2-1 .inner-1400{margin-bottom:0}
}

@media screen and (max-width:768px) {
	.subCon2-1 .inner .video{
	position: relative;
    padding-top: 75%;
	}
	.subCon2-1 .inner-1400 .flex .titWrap{margin-bottom:2rem}
	.subCon2-1 .inner-1400 .flex > div{display:block}
}

/* --------------- subCon3_¼ö¸ñ¿ø »ç°è -------------------- */
.subCon2-2{position:relative}
.subCon2-2 .inner-1400{}
.subCon2-2 .inner-1400 .flex{b}
.subCon2-2 .inner-1400 .flex {
	margin-bottom:4rem;
	padding-bottom:4rem
}
.subCon2-2 .inner-1400 .flex .titWrap .font-size-1{font-weight:700; color:#947b58}
.subCon2-2 .inner-1400 .flex .text-box{
	display: flex;
	align-items: center;
	align-content:center;
	justify-content: space-between;
	}
.subCon2-2 .inner-1400 .flex .text-box .titWrap {width:50%}
.subCon2-2 .inner-1400 .flex .text-box .sub-text {margin-top:2rem; border-left:solid 1px #dadada; padding-left:2rem}
.subCon2-2 .inner-1400 .conWrap .con-top{display: flex; align-items: center; justify-content: space-between; flex-wrap:wrap; padding:6rem 0 15rem; position:relative; z-index:20}
.subCon2-2 .inner-1400 .conWrap .con-top{padding-top:6rem}
.subCon2-2 .inner-1400 .conWrap .con-top .text-box{width:35%;}
.subCon2-2 .inner-1400 .conWrap .con-top .text-box .tit{font-size:7rem; font-weight:400 !important; margin-bottom:2rem; text-align:center;   font-family: 'GyeonggiBatang';}
.subCon2-2 .inner-1400 .conWrap .con-top .text-box .tit span{display:inline-block; font-size:var(--font-size-1); margin-left:30px; padding-left:50px; border-left:solid 1px #dadada; font-family: 'MapoFlowerIsland' !important; }
.subCon2-2 .inner-1400 .conWrap .con-top .text-box .subtext{ font-size:var(--font-size-6); text-align:center}
.subCon2-2 .inner-1400 .conWrap .con-top .img-box{width:60%; position:relative; }

.subCon2-2 .inner-1400 .conWrap > div:nth-child(odd)  .con-top .img-box{ padding-right:4rem; text-align:right}
.subCon2-2 .inner-1400 .conWrap > div:nth-child(even)  .con-top .img-box{ padding-left:4rem}

.subCon2-2 .inner-1400 .conWrap .con-top .img-box img{position:relative; z-index:1}
.subCon2-2 .inner-1400 .conWrap .con-top .img-box:after{display:block; content:""; position:absolute; right:0; bottom:-13.5%; z-index:0; width:50%; height:130%;}

.subCon2-2 .inner-1400 .conWrap .con-photo{display: flex;align-items: stretch;  align-content: first baseline; flex-wrap: wrap;  justify-content:center;}
.subCon2-2 .inner-1400 .conWrap .con-photo > div{flex:0 0 32%; margin-right:2%; margin-bottom:2%}
.subCon2-2 .inner-1400 .conWrap .con-photo > div:nth-child(3n+3){margin-right:0}
.subCon2-2 .inner-1400 .conWrap .con-photo > div:nth-child(5){margin-top:-16.5%}

.subCon2-2 .inner-1400 .conWrap .con-1{position:relative; margin-bottom:8rem}
.subCon2-2 .inner-1400 .conWrap .con-1 .con-top .img-box:after{background:#b74b86}
.subCon2-2 .inner-1400 .conWrap .con-1 .con-top .text-box .tit{color:#b74b86}}
.subCon2-2 .inner-1400 .conWrap .con-1 .back-leaf {position:absolute;}
.subCon2-2 .inner-1400 .conWrap .con-1 .back-leaf .leaf-01{position:absolute; left:5%; top:0; z-index:10;  }
.subCon2-2 .inner-1400 .conWrap .con-1 .back-leaf .leaf-02{position:absolute; left:20%; top:0; z-index:10;}
.subCon2-2 .inner-1400 .conWrap .con-1 .back-leaf .leaf-03{position:absolute; left:-8%; top:0; z-index:11; }
.subCon2-2 .inner-1400 .conWrap .con-1 .back-leaf .leaf-04{position:absolute; left:20%; top:33%; z-index:11;}

.subCon2-2 .inner-1400 .conWrap .con-2{position:relative; margin-bottom:8rem}
.subCon2-2 .inner-1400 .conWrap .con-2 .con-top .img-box{}
.subCon2-2 .inner-1400 .conWrap .con-2 .con-top .img-box:after{position:absolute; left:0; background:#1c410c; }
.subCon2-2 .inner-1400 .conWrap .con-2 .con-top .text-box .tit{color:#1c410c}}
.subCon2-2 .inner-1400 .conWrap .con-2 .back-leaf {position:absolute;}
.subCon2-2 .inner-1400 .conWrap .con-2 .back-leaf .leaf-01{position:absolute; right:-20%; top:0; z-index:10;  }
.subCon2-2 .inner-1400 .conWrap .con-2 .back-leaf .leaf-02{position:absolute; left:28%; top:27%; z-index:0;}

.subCon2-2 .inner-1400 .conWrap .con-3{position:relative; margin-bottom:8rem}
.subCon2-2 .inner-1400 .conWrap .con-3 .con-top .img-box{}
.subCon2-2 .inner-1400 .conWrap .con-3 .con-top .img-box:after{position:absolute; right:0; background:#472e18; }
.subCon2-2 .inner-1400 .conWrap .con-3 .con-top .text-box .tit{color:#472e18}}
.subCon2-2 .inner-1400 .conWrap .con-3 .back-leaf {position:absolute;}
.subCon2-2 .inner-1400 .conWrap .con-3 .back-leaf .leaf-01{position:absolute; right:50%; top:30%; z-index:0;  }
.subCon2-2 .inner-1400 .conWrap .con-3 .back-leaf .leaf-02{position:absolute; left:10%; top:35%; z-index:10;  }
.subCon2-2 .inner-1400 .conWrap .con-3 .back-leaf .leaf-03{position:absolute; left:-10%; top:5%; z-index:0;  }

.subCon2-2 .inner-1400 .conWrap .con-4{position:relative}
.subCon2-2 .inner-1400 .conWrap .con-4 .con-top .img-box{}
.subCon2-2 .inner-1400 .conWrap .con-4 .con-top .img-box:after{position:absolute; left:0; background:#3a5e6e; }
.subCon2-2 .inner-1400 .conWrap .con-4 .con-top .text-box .tit{color:#3a5e6e}}
.subCon2-2 .inner-1400 .conWrap .con-4 .back-leaf {position:absolute;}
.subCon2-2 .inner-1400 .conWrap .con-4 .back-leaf .leaf-01{position:absolute; right:0%; top:0; z-index:10;  }
.subCon2-2 .inner-1400 .conWrap .con-4 .back-leaf .leaf-02{position:absolute; left:-15%; top:7%; z-index:5;}
.subCon2-2 .inner-1400 .conWrap .con-4 .back-leaf .leaf-03{position:absolute; left:80%; top:35%; z-index:0;}
.subCon2-2 .inner-1400 .conWrap .con-4 .back-leaf .leaf-04{position:absolute; left:60%; top:17%; z-index:5;}


@media screen and (max-width:1200px) {
	.subCon2-2 .inner-1400 .conWrap .con-2 .back-leaf img{width:70%}
}
@media screen and (max-width:768px) {
	.subCon2-2 .inner-1400 .flex .text-box .titWrap {width:100%}
	.subCon2-2 .inner-1400 .flex{margin:0; padding:0}
	.subCon2-2 .inner-1400 .flex .text-box{display:block}
	.subCon2-2 .inner-1400 .conWrap .con-top{flex-direction: column; }
	.subCon2-2 .inner-1400 .conWrap .con-top .text-box{width:100%;}
	.subCon2-2 .inner-1400 .conWrap > div:nth-child(odd) .con-top .img-box{text-align:center; padding:3rem 2rem 2rem 2rem}
	.subCon2-2 .inner-1400 .conWrap > div:nth-child(even) .con-top .img-box{text-align:center; padding:3rem 2rem 2rem 2rem}
	.subCon2-2 .inner-1400 .conWrap .con-top{padding:4rem 0}
	.subCon2-2 .inner-1400 .conWrap .con-top .img-box{width:100%;}
	.subCon2-2 .inner-1400 .conWrap .con-top .img-box img{ }
	.subCon2-2 .inner-1400 .conWrap .con-top .img-box:after{height:30%; width:100%; bottom:0;}
	.subCon2-2 .inner-1400 .conWrap .con-photo{
	display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-gap: 5px;
    grid-auto-rows: minmax(100px, auto);
	}
	.subCon2-2 .inner-1400 .conWrap .con-photo > div{margin-bottom:0}
	.subCon2-2 .inner-1400 .conWrap .con-photo > div:nth-child(1){grid-column: 0; grid-row:0;}
	.subCon2-2 .inner-1400 .conWrap .con-photo > div:nth-child(2){grid-column: 0; grid-row:2; }
	.subCon2-2 .inner-1400 .conWrap .con-photo > div:nth-child(3){grid-column: 0; grid-row:0; }
	.subCon2-2 .inner-1400 .conWrap .con-photo > div:nth-child(4){grid-column: 0; grid-row:2; }
	.subCon2-2 .inner-1400 .conWrap .con-photo > div:nth-child(5){margin-top:0}

	.subCon2-2 .inner-1400 .conWrap .con-1 .back-leaf img{width:70%}
	.subCon2-2 .inner-1400 .conWrap .con-1{margin-top:0; margin-bottom:3rem}
	.subCon2-2 .inner-1400 .conWrap .con-1 .back-leaf .leaf-01{left:42%; top:-2%; }
	.subCon2-2 .inner-1400 .conWrap .con-1 .back-leaf .leaf-02{display:none }
	.subCon2-2 .inner-1400 .conWrap .con-1 .back-leaf .leaf-04{left:80%; top:5%; }

	.subCon2-2 .inner-1400 .conWrap .con-2 .con-top{flex-direction:column-reverse}
	.subCon2-2 .inner-1400 .conWrap .con-2{margin-bottom:0rem}
	.subCon2-2 .inner-1400 .conWrap .con-2 .back-leaf img{width:100%}
	.subCon2-2 .inner-1400 .conWrap .con-2 .back-leaf .leaf-01{left:80%; top:-10%;}
	.subCon2-2 .inner-1400 .conWrap .con-2 .back-leaf .leaf-02{display:none}

	.subCon2-2 .inner-1400 .conWrap .con-3{margin-bottom:0rem}
	.subCon2-2 .inner-1400 .conWrap .con-3 .back-leaf .leaf-03 img{width:40%}
	.subCon2-2 .inner-1400 .conWrap .con-3 .back-leaf .leaf-02{left:90%; top:30%}

	.subCon2-2 .inner-1400 .conWrap .con-4{margin-bottom:0rem}
	.subCon2-2 .inner-1400 .conWrap .con-4 .back-leaf .leaf-01 img{width:50%}

	.subCon2-2 .inner-1400 .conWrap .con-4 .con-top{flex-direction:column-reverse}
	.subCon2-2 .inner-1400 .conWrap .con-5{margin-bottom:0rem}
	

}


/* --------------- subCon4_ÀÌ¿ë¾È³» -------------------- */
.subCon2-3{position:relative}
.subCon2-3 .inner-1400{}
.subCon2-3 .inner-1400 .flex {}


/* --------------- subCon5_À¯ÀÇ»çÇ× -------------------- */
.subCon2-4{position:relative}
.subCon2-4  h2{border-bottom:solid 5px var(--color-brown); padding-bottom:3rem}
.subCon2-4  .flex {
	display: flex;
	/*align-items: center;
	align-content:center;*/
	}
.subCon2-4 .inner-1400 .flex .list-box{margin-left:5rem}
.subCon2-4 .inner-1400 .img-box{width:100%;height:400px; overflow:hidden}
.subCon2-4 .inner-1400 .img-box img{max-width:100%}

@media screen and (max-width:768px) {
	.subCon2-4 .flex{display:block}
	.subCon2-4 .inner-1400 .flex .list-box{margin-left:0}
	.subCon2-4 .inner-1400 .img-box{height:auto; }

}



/* --------------- subCon5_ÀÚÁÖÇÏ´Â Áú¹® -------------------- */
.subCon2-4{position:relative}
.faq_wrap .group{position: relative;width:100%;word-break: keep-all;transition:0.2s;cursor: pointer;background: #fff;padding: 0 50px;border-top-left-radius: 30px;border-bottom-right-radius: 30px;}
.faq_wrap .group > *{position: relative;overflow: hidden;padding: 32px 0px;}
.faq_wrap .group + .group{margin-top: 20px;}
.faq_wrap .group .item{position: relative;top: 2px;width: 38px;float: left;font-size: 1.5rem;color: #000;font-weight: 700;font-family: 'Montserrat',sans-serif;line-height: 1;}
.faq_wrap .group .list .item{color: #3d62b1;}
.faq_wrap .list .tit{font-size:1.3rem;color: #222222;font-weight: 600;width:70%; float:left}
.faq_wrap .view{width: 100%;border-top: 1px solid #cccccc;display: none;}
.faq_wrap .view .item{color: #222222;}
.faq_wrap .textarea{width: calc(100% - 45px);float: left;color: #555555;}
.faq_wrap button{display:none;width: 17px;height: 17px;position: absolute;top: 50%;right: 0;transform: translateY(-50%);}
.faq_wrap button:before,
.faq_wrap button:after{display: block;content:"";position: absolute;top: 50%;left: 0;width: 100%;height: 3px;background: #000;margin-top: -3px;}
.faq_wrap button:after{transform: rotate(90deg);top: 6px;margin: 0;}
.faq_wrap .group.act button:after{display: none;}
.faq_container .faq_wrap .group{border: 1px solid #dddddd;}
.faq_container .faq_wrap .group.act{background: #3d62b1;color: #fff;border: 0;}
.faq_container .faq_wrap .group.act *{color:#fff;}
.faq_container .faq_wrap .group.act .view{border-color:rgba(255,255,255,0.2);}
.faq_container .faq_wrap .group.act button:after,
.faq_container .faq_wrap .group.act button:before{background:#fff;}


@media screen and (max-width:768px) {

	.faq_wrap .group{padding:0 30px}
}



/* --------------- subCon3-1_Ä«Æä -------------------- */
.subCon3-1{}
.subCon3-1 .con-1{padding:0 40px}
.subCon3-1 .con-1 .con-top{text-align:center; position:relative; }
.subCon3-1 .con-1 .con-top .tit{ position:absolute; z-index:2;  left:0; right:0; bottom:0; top:0; margin:0 auto; font-size:4rem; line-height:5rem; color:var(--color-brown);  font-family: 'YUniverse-B'; }
.subCon3-1 .con-1 .con-top .img-box{max-width:600px; margin:0 auto; position:relative; z-index:1;}
.subCon3-1 .con-1 .con-top .img-box img{border-radius:400px 400px 0 0}
.subCon3-1 .con-1 .con-top .back-deco .deco-01{position:absolute; left:20%; top:70%; z-index:0;  }
.subCon3-1 .con-1 .con-top .back-deco .deco-01 img{width:50%}
.subCon3-1 .con-1 .con-top .back-deco .deco-02{position:absolute; right:20%; top:20%; z-index:0;}
.subCon3-1 .con-1 .con-top .back-deco .deco-02 img{width:60%}
.subCon3-1 .con-1 .con-top .back-deco .deco-03{position:absolute; right:-15%; top:45%; z-index:0;}
.subCon3-1 .con-1 .con-top .back-deco .deco-03 img{width:70%}
.subCon3-1 .con-1 .con-top .back-deco .deco-04{position:absolute; left:-5%; top:10%; z-index:0;}
.subCon3-1 .con-1 .con-top .back-deco .deco-04 img{width:80%}

.subCon3-1 .con-2{margin-top:8rem; padding:8rem 0; background-image: url(/theme/cafe2/images/sub/bg_coffee.jpg); background-size: cover; background-repeat: no-repeat; background-position: top center; }
.subCon3-1 .con-2 .img-list {
	display: flex;
    gap: 0 40px;
    justify-content: center;
}
.subCon3-1 .con-2 .img-list > li {
    max-width: 500px;
	 background-color: #fff;
}
.subCon3-1 .con-2 .img-list .cont {
	padding-top:2rem;
    text-align: center;
    min-height:220px;
}

.subCon3-1 .con-2 .img-list .cont .position {
    font-weight: 300;
    line-height: 1;
	font-size:2rem;
	font-family: 'YUniverse-B';
	margin-bottom:1rem;
}


.subCon3-1 .con-3{ padding:8rem 0 0 0;  }
.subCon3-1 .con-3 .con-top{margin-bottom:12rem; background-image: url(/theme/cafe2/images/sub/en-cafename.png); background-size:auto 100%; background-repeat: no-repeat; background-position: center right; }
.subCon3-1 .con-3 .img-list {
	display: flex; 
	justify-content:  space-between;
	align-item: center;
	flex-wrap: wrap; 
	gap: 0 60px;
}
.subCon3-1 .con-3 .img-list > div{
    max-width: 500px;
	flex:0 0 30%;
	margin-bottom:60px;
}
.subCon3-1 .con-3 .img-list > div:nth-child(3n+2){
    margin-top:-10%;
}
.subCon3-1 .con-3 .img-list {margin-bottom:60px}
.subCon3-1 .con-3 .con-top .tit .font-size-1{font-family: 'YUniverse-B' !important}


@media screen and (max-width:768px) {
	.subCon3-1 .con-2{ margin-top: 4rem; padding: 4rem 0;}
	.subCon3-1 .con-3{padding-top:4rem}
	.subCon3-1 .con-1 .con-top .tit {font-size:3rem; line-height:1.25}
	.subCon3-1 .con-1 .con-top .back-deco{display:none}
	.subCon3-1 .con-2 .img-list {flex-direction: column; justify-content: center; align-items: center;}
	.subCon3-1 .con-2 .img-list li{margin-bottom:2rem;   /* display: flex;flex-direction: colum*/}
	.subCon3-1 .con-2 .img-list .cont{min-height:auto; padding:2rem 1rem}
	.subCon3-1 .con-3 .con-top{background-size:contain; background-position: right bottom; margin-bottom:3em; padding-bottom:7rem}
	.subCon3-1 .con-3 .img-list{gap: 0 10px; }
	.subCon3-1 .con-3 .img-list > div{flex:0 0 45%;  margin-bottom:20px}
	.subCon3-1 .con-3 .img-list > div:nth-child(3n+2){margin-top:0%;}
}






/* --------------- subCon3-2_¿þµù¿¬È¸ -------------------- */
.subCon3-2{}
.subCon3-2 .con-1{padding:0 40px}
.subCon3-2 .con-1 .con-top{text-align:center; position:relative; }
.subCon3-2 .con-1 .con-top .tit{ position:absolute; z-index:2;  left:0; right:0; bottom:0; top:0; margin:0 auto; font-size:5rem; line-height:5rem; color:var(--color-green);  font-family: 'YUniverse-B'; }
.subCon3-2 .con-1 .con-top .img-box{max-width:600px; margin:0 auto; position:relative; z-index:1;}
.subCon3-2 .con-1 .con-top .img-box img{border-radius:400px 400px 0 0}
.subCon3-2 .con-1 .con-top .back-deco .deco-01{position:absolute; left:20%; top:70%; z-index:0;  }
.subCon3-2 .con-1 .con-top .back-deco .deco-01 img{width:50%}
.subCon3-2 .con-1 .con-top .back-deco .deco-02{position:absolute; right:20%; top:20%; z-index:0;}
.subCon3-2 .con-1 .con-top .back-deco .deco-02 img{width:60%}
.subCon3-2 .con-1 .con-top .back-deco .deco-03{position:absolute; right:-15%; top:45%; z-index:0;}
.subCon3-2 .con-1 .con-top .back-deco .deco-03 img{width:70%}
.subCon3-2 .con-1 .con-top .back-deco .deco-04{position:absolute; left:-5%; top:10%; z-index:0;}
.subCon3-2 .con-1 .con-top .back-deco .deco-04 img{width:80%}

.subCon3-2 .con-2{margin-top:8rem; padding:8rem 0; background-image: url(/theme/cafe2/images/sub/bg_letter.png); background-size: cover; background-repeat: no-repeat; background-position: top center; }
.subCon3-2 .con-2 .img-list {
	display: flex;
    gap: 0 40px;
    justify-content: center;
}
.subCon3-2 .con-2 .img-list > li {
    max-width: 500px;
	 background-color: #fff;
}
.subCon3-2 .con-2 .img-list .cont {
	padding-top:2rem;
    text-align: center;
    min-height:220px;
}

.subCon3-2 .con-2 .img-list .cont .position {
    font-weight: 300;
    line-height: 1;
	font-size:2rem;
	margin-bottom:1rem;
	font-family: 'YUniverse-B';
}


.subCon3-2 .con-3{ padding:8rem 0 0 0;  }
.subCon3-2 .con-3 .con-top{margin-bottom:5rem; background-image: url(/theme/cafe2/images/sub/en-wedding.png); background-size:auto 100%; background-repeat: no-repeat; background-position: center right; }
.subCon3-2 .con-3 .con-top.bb{background-image: url(/theme/cafe2/images/sub/en-birthday.png); background-size:auto 100%; background-repeat: no-repeat; background-position: center right; }
.subCon3-2 .con-3 .font-size-1{font-family: 'YUniverse-B' !important}

.subCon3-2 .con-3 .img-list {
	 display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
	flex-wrap: wrap;
    position: relative;
	gap:4rem;
}
.subCon3-2 .con-3 .img-list > div{
    max-width: 800px;
	flex:0 0 45%;
	
}
.subCon3-2 .con-3 .img-list > div:nth-child(2n+2){
    margin-top:-30%;
}
.subCon3-2 .con-3 .img-list {margin-bottom:0}


@media screen and (max-width:768px) {
	.subCon3-2 br{display:none}
	.subCon3-2 .con-2{ margin-top: 4rem; padding: 4rem 0;}
	.subCon3-2 .con-3{padding-top:4rem}
	.subCon3-2 .con-1 .con-top .tit {font-size:3rem; line-height:1.25}
	.subCon3-2 .con-1 .con-top .back-deco{display:none}
	.subCon3-2 .con-2 .img-list {flex-direction: column; justify-content: center; align-items: center;}
	.subCon3-2 .con-2 .img-list .cont{min-height:auto; padding:2rem 1rem}
	.subCon3-2 .con-3 .con-top.bb{background-size:contain !important; background-position: right 110%;  padding-bottom:7rem; margin-bottom:0}
	.subCon3-2 .con-3 .con-top{background-size:contain !important; background-position: right 110%;  padding-bottom:7rem; margin-bottom:0}
	.subCon3-2 .con-3 .img-list{gap: 0 10px; }
	.subCon3-2 .con-3 .img-list > div{flex:0 0 100%;  margin-bottom:20px}
	.subCon3-2 .con-3 .img-list > div:nth-child(2n+2){margin-top:0%;}
}




/* --------------- subCon3-3_¿Â½Ç -------------------- */
.subCon3-3{}
.subCon3-3 .con-1{padding:0 40px}
.subCon3-3 .con-1 .con-top{text-align:center; position:relative; }
.subCon3-3 .con-1 .con-top .tit{ position:absolute; z-index:2;  left:0; right:0; bottom:0; top:0; margin:0 auto; font-size:5rem; line-height:5rem; color:var(--color-green);  font-family: 'YUniverse-B'; }
.subCon3-3 .con-1 .con-top .img-box{max-width:600px; margin:0 auto; position:relative; z-index:1;}
.subCon3-3 .con-1 .con-top .img-box img{border-radius:400px 400px 0 0}
.subCon3-3 .con-1 .con-top .back-deco .deco-01{position:absolute; left:20%; top:70%; z-index:0;  }
.subCon3-3 .con-1 .con-top .back-deco .deco-01 img{width:50%}
.subCon3-3 .con-1 .con-top .back-deco .deco-02{position:absolute; right:20%; top:20%; z-index:0;}
.subCon3-3 .con-1 .con-top .back-deco .deco-02 img{width:60%}
.subCon3-3 .con-1 .con-top .back-deco .deco-03{position:absolute; right:-15%; top:45%; z-index:0;}
.subCon3-3 .con-1 .con-top .back-deco .deco-03 img{width:70%}
.subCon3-3 .con-1 .con-top .back-deco .deco-04{position:absolute; left:-5%; top:10%; z-index:0;}
.subCon3-3 .con-1 .con-top .back-deco .deco-04 img{width:80%}

.subCon3-3 .con-2{margin-top:8rem; padding:8rem 0; background-image: url(/theme/cafe2/images/sub/bg_cactus.png); background-size: cover; background-repeat: no-repeat; background-position: top center; }
.subCon3-3 .con-2 .img-list {
	display: flex;
    gap: 0 40px;
    justify-content: center;
}
.subCon3-3 .con-2 .img-list > li {
    max-width: 500px;
	 background-color: #fff;
}
.subCon3-3 .con-2 .img-list .cont {
	padding-top:2rem;
    text-align: center;
    min-height:220px;
}

.subCon3-3 .con-2 .img-list .cont .position {
    font-weight: 300;
    line-height: 1;
	font-size:2rem;
	margin-bottom:1rem;
	font-family: 'YUniverse-B';
}


.subCon3-3 .con-3{ padding:8rem 0 0 0;  }
.subCon3-3 .con-3 .con-top{margin-bottom:5rem;  background-size:auto 100%; background-repeat: no-repeat; background-position: center right; }
.subCon3-3 .con-3 .font-size-1{font-family: 'YUniverse-B' !important}

.subCon3-3 .con-3 .img-list {
	 display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
	flex-wrap: wrap;
    position: relative;
	gap:4rem;
}
.subCon3-3 .con-3 .img-list > div{
    max-width: 800px;
	flex:0 0 45%;
	
}
.subCon3-3 .con-3 .img-list > div:nth-child(2n+2){
    margin-top:-30%;
}
.subCon3-3 .con-3 .img-list {margin-bottom:0}


@media screen and (max-width:768px) {
	.subCon3-3 br{display:none}
	.subCon3-3 .con-2{ margin-top: 4rem; padding: 4rem 0;}
	.subCon3-3 .con-3{padding-top:4rem}
	.subCon3-3 .con-1 .con-top .tit {font-size:3rem; line-height:1.25}
	.subCon3-3 .con-1 .con-top .back-deco{display:none}
	.subCon3-3 .con-2 .img-list {flex-direction: column; justify-content: center; align-items: center;}
	.subCon3-3 .con-2 .img-list .cont{min-height:auto; padding:2rem 1rem}
	.subCon3-3 .con-3 .con-top.bb{background-size:contain !important; background-position: right 110%;  padding-bottom:7rem; margin-bottom:0}
	.subCon3-3 .con-3 .con-top{background-size:contain !important; background-position: right 110%;  padding-bottom:7rem; margin-bottom:0}
	.subCon3-3 .con-3 .img-list{gap: 0 10px; }
	.subCon3-3 .con-3 .img-list > div{flex:0 0 100%;  margin-bottom:20px}
	.subCon3-3 .con-3 .img-list > div:nth-child(2n+2){margin-top:0%;}
}




/* --------------- subCon3-4_¿Â½Ç -------------------- */
.subCon3-4{}
.subCon3-4 .con-1{padding:0 40px}
.subCon3-4 .con-1 .con-top{text-align:center; position:relative; }
.subCon3-4 .con-1 .con-top .tit{ position:absolute; z-index:2;  left:0; right:0; bottom:0; top:0; margin:0 auto; font-size:5rem; line-height:5rem; color:var(--color-green);  font-family: 'YUniverse-B'; }
.subCon3-4 .con-1 .con-top .img-box{max-width:600px; margin:0 auto; position:relative; z-index:1;}
.subCon3-4 .con-1 .con-top .img-box img{border-radius:400px 400px 0 0}
.subCon3-4 .con-1 .con-top .back-deco .deco-01{position:absolute; left:20%; top:70%; z-index:0;  }
.subCon3-4 .con-1 .con-top .back-deco .deco-01 img{width:50%}
.subCon3-4 .con-1 .con-top .back-deco .deco-02{position:absolute; right:20%; top:20%; z-index:0;}
.subCon3-4 .con-1 .con-top .back-deco .deco-02 img{width:60%}
.subCon3-4 .con-1 .con-top .back-deco .deco-03{position:absolute; right:-15%; top:45%; z-index:0;}
.subCon3-4 .con-1 .con-top .back-deco .deco-03 img{width:70%}
.subCon3-4 .con-1 .con-top .back-deco .deco-04{position:absolute; left:-5%; top:10%; z-index:0;}
.subCon3-4 .con-1 .con-top .back-deco .deco-04 img{width:80%}

.subCon3-4 .con-2{margin-top:8rem; padding:8rem 0; background-image: url(/theme/cafe2/images/sub/bg_wave.png); background-size: cover; background-repeat: no-repeat; background-position: top center; }
.subCon3-4 .con-2 .img-list {
	display: flex;
    gap: 0 40px;
    justify-content: center;
}
.subCon3-4 .con-2 .img-list > li {
    max-width: 500px;
	 background-color: #fff;
}
.subCon3-4 .con-2 .img-list .cont {
	padding-top:2rem;
    text-align: center;
    min-height:220px;
}

.subCon3-4 .con-2 .img-list .cont .position {
    font-weight: 300;
    line-height: 1;
	font-size:2rem;
	margin-bottom:1rem;
	font-family: 'YUniverse-B';
}


.subCon3-4 .con-3{ padding:8rem 0 0 0;  }
.subCon3-4 .con-3 .con-top{margin-bottom:5rem;  background-size:auto 100%; background-repeat: no-repeat; background-position: center right; }
.subCon3-4 .con-3 .font-size-1{font-family: 'YUniverse-B' !important}

.subCon3-4 .con-3 .img-list {
	 display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
	flex-wrap: wrap;
    position: relative;
	gap:4rem;
}
.subCon3-4 .con-3 .img-list > div{
    max-width: 800px;
	flex:0 0 45%;
	
}
.subCon3-4 .con-3 .img-list > div:nth-child(2n+2){
    margin-top:-30%;
}
.subCon3-4 .con-3 .img-list {margin-bottom:0}


@media screen and (max-width:768px) {
	.subCon3-4 br{display:none}
	.subCon3-4 .con-2{ margin-top: 4rem; padding: 4rem 0;}
	.subCon3-4 .con-3{padding-top:4rem}
	.subCon3-4 .con-1 .con-top .tit {font-size:3rem; line-height:1.25}
	.subCon3-4 .con-1 .con-top .back-deco{display:none}
	.subCon3-4 .con-2 .img-list {flex-direction: column; justify-content: center; align-items: center;}
	.subCon3-4 .con-2 .img-list .cont{min-height:auto; padding:2rem 1rem}
	.subCon3-4 .con-3 .con-top.bb{background-size:contain !important; background-position: right 110%;  padding-bottom:7rem; margin-bottom:0}
	.subCon3-4 .con-3 .con-top{background-size:contain !important; background-position: right 110%;  padding-bottom:7rem; margin-bottom:0}
	.subCon3-4 .con-3 .img-list{gap: 0 10px; }
	.subCon3-4 .con-3 .img-list > div{flex:0 0 100%;  margin-bottom:20px}
	.subCon3-4 .con-3 .img-list > div:nth-child(2n+2){margin-top:0%;}
}