@charset "utf-8";

.slick-vertical .slick-slide {border:0 !important;}

.main-notice {position:absolute; top:45px; left:50%; margin-left:-700px; width:283px; padding-top:13px; background:#fff; z-index:50;}
.main-notice:before {content:""; position:absolute; top:-7px; height:19px; left:11px; right:8px; background:url("../images/main/notice_obj.png") 0 0 repeat-x;}
.main-notice .head {text-align:center; font-family:'LotteMartDream',sans-serif; color:#505050; font-size:18px; font-weight:700; line-height:45px; letter-spacing:-.01em;}
.main-notice .head span {color:#6cca14; font-size:20px;}
.main-notice .body {padding:11px 18px 17px; color:#fff; background:url("../images/main/notice_bg.jpg") 50% 50% no-repeat; background-size:cover;}
.main-notice .tit {text-align:center; font-family:'LotteMartDream',sans-serif; font-size:20px; line-height:1.3em; letter-spacing:-.04em; font-weight:700;}
.main-notice .tit span {position:relative; top:12px;}
.main-notice ul li {position:relative; height:26px; padding:0 60px 0 8px; font-size:14px; line-height:26px; letter-spacing:-.04em;}
.main-notice ul li:before {content:"·"; position:absolute; top:0; left:-2px; font-weight:500;}
.main-notice ul li a {display:inline-block; max-width:100%; vertical-align:top; height:26px; font-weight:500; overflow:hidden; white-space:nowrap; word-break:break-all; text-overflow:ellipsis;}
.main-notice ul li span {position:absolute; top:0; right:0; font-size:12px; font-weight:300;}

.main-home {position:relative; height:calc(100vh - 100px); margin-bottom:100px; text-align:center; overflow:hidden; background:url("../images/main/mv_bg.jpg") 50% 50% no-repeat; background-size:cover;}
.main-home .mv-txt1 {position:relative; margin-top:5%; z-index:5;}
.main-home .mv-txt2 {position:relative; margin-top:-20px; z-index:4;}
.main-home .mv-txt3 {position:relative; margin-top:30px; z-index:5; color:#505050; font-family:'S-CoreDream',sans-serif; font-weight:500; font-size:18px; line-height:1.889em; letter-spacing:-.04em;}
.main-home .mv-rabbit {position:absolute; top:14%; left:50%; margin-left:315px; z-index:6;}
.main-home .mv-bottom {position:absolute; top:0; bottom:0; width:100%; height:100%;  background:url("../images/main/mv_bottom.png") 50% 100% no-repeat; background-size:contain; z-index:1;}
.main-home .mv-bnr {position:relative; max-width:1250px; margin:0 auto; margin-top:40px; z-index:5;}
.main-home .mv-bnr:after {content:""; display:block; clear:both;}
.main-home .mv-bnr div {float:left; width:25%; padding:0 25px;}
.main-home .mv-left {position:absolute; top:5%; left:0;}
.main-home .mv-right {position:absolute; top:5%; right:0;}

.mv-txt1 {transform:translateX(-100%); opacity:0;}
.mv-txt2 {transform:translateX(100%); opacity:0;}
.mv-txt3 {transform:translateY(100%); opacity:0;}
.mv-bnr div {transform:translateY(100%); opacity:0;}
.mv-left {opacity:0;}
.mv-right {opacity:0;}

.page-loaded .mv-txt1 {transition-duration:.2s; transform:translateX(0); opacity:1;}
.page-loaded .mv-txt2 {transition-duration:.2s; transform:translateX(0); opacity:1; transition-delay:.4s;}
.page-loaded .mv-txt3 {transition-duration:.4s;transform:translateY(0); opacity:1; transition-delay:.8s;}
.page-loaded .mv-rabbit {animation-delay:.4s; animation-duration:.6s; animation-iteration-count:5; animation-name:rabbit;}
.page-loaded .mv-bnr div {transition-duration:.8s;}
.page-loaded .mv-bnr div:nth-child(1) {transform:translateY(0); opacity:1; transition-delay:3.0s;}
.page-loaded .mv-bnr div:nth-child(2) {transform:translateY(0); opacity:1; transition-delay:3.5s;}
.page-loaded .mv-bnr div:nth-child(3) {transform:translateY(0); opacity:1; transition-delay:4.0s;}
.page-loaded .mv-bnr div:nth-child(4) {transform:translateY(0); opacity:1; transition-delay:4.5s;}
.page-loaded .mv-left {left:50%; margin-left:-185px; transition-duration:1.8s; transition-delay:1.1s; opacity:1;}
.page-loaded .mv-right {right:50%; margin-right:-185px; transition-duration:1.8s; transition-delay:1.1s; opacity:1;}

@keyframes rabbit{
	20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  100% {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

.m-head {text-align:center; margin-bottom:57px;}
.m-head h2 {padding-top:63px; color:#221e1f; text-shadow:1px 0 0 #221e1f; font-family:'LotteMartDream',sans-serif; font-size:30px; font-weight:700; line-height:1.3em; letter-spacing:-.03em; background:url("../images/main/tit_icon.png") 50% 0 no-repeat;}

.main-system {padding:120px 0; text-align:center;}
.main-system .cnt ul {margin:0 -23px;}
.main-system .cnt ul:after {content:""; display:block; clear:both;}
.main-system .cnt ul li {float:left; width:20%; padding:0 23px;}
.main-system .cnt ul li a {display:block; position:relative; color:#fff; font-family:'LotteMartDream',sans-serif; font-size:20px; 
	font-weight:700; line-height:1.3em; letter-spacing:-.03em; padding-bottom:100%; 
	background-position:50% 50%; background-repeat:no-repeat; background-size:cover;
	border-radius:100%;
	box-shadow:2px 2px 2px rgba(0,0,0,.15);
}
.main-system .cnt ul li a:before {content:""; position:absolute; top:0; left:0; right:0; bottom:0; background:#000; opacity:.26; border-radius:100%; transition:.2s;}
.main-system .cnt ul li a:after {content:""; position:absolute; top:-1px; left:-1px; right:-1px; bottom:-1px; border-radius:100%; transition:.2s;}
.main-system .cnt ul li i {display:block; margin:0 auto 14px; width:71px; height:71px; background-position:50% 50%; background-repeat:no-repeat;}
.main-system .cnt ul li .in {position:absolute; top:50%; left:0; width:100%; padding:0 10px; margin-top:-56px; z-index:5;}
.main-system .cnt ul li a:hover::before {background:#fa78b3; opacity:.6;}
.main-system .cnt ul li a:hover::after {border:3px solid #ed6ea7;}
.main-system .cnt .ico-1 {background-image:url("../images/main/system_1_icon.png");}
.main-system .cnt .ico-2 {background-image:url("../images/main/system_2_icon.png");}
.main-system .cnt .ico-3 {background-image:url("../images/main/system_3_icon.png");}
.main-system .cnt .ico-4 {background-image:url("../images/main/system_4_icon.png");}
.main-system .cnt .ico-5 {background-image:url("../images/main/system_5_icon.png");}
.main-system .cnt .link-1 a {background-image:url("../images/main/system_1_bg.jpg");}
.main-system .cnt .link-2 a {background-image:url("../images/main/system_2_bg.jpg");}
.main-system .cnt .link-3 a {background-image:url("../images/main/system_3_bg.jpg");}
.main-system .cnt .link-4 a {background-image:url("../images/main/system_4_bg.jpg");}
.main-system .cnt .link-5 a {background-image:url("../images/main/system_5_bg.jpg");}

.main-franchise {padding:82px 0; color:#fff; background:url("../images/main/franchise_bg.jpg") 50% 50% no-repeat; background-size:cover;}
.main-franchise .m-head h2 {color:#fff; text-shadow:1px 0 0 #fff;}
.main-franchise .cnt ul {margin:-18px;}
.main-franchise .cnt ul:after {content:""; display:block; clear:both;}
.main-franchise .cnt ul li {float:left; width:33.33333333%; padding:18px;}
.main-franchise .cnt ul li a {display:block; height:154px; position:relative; padding:36px 100px 36px 137px; border:3px solid #fff; border-radius:20px;}
.main-franchise .cnt ul li a:before {content:""; position:absolute; top:50%; left:38px; margin-top:-36px; width:72px; height:72px; background-position:50% 50%; background-repeat:no-repeat;}
.main-franchise .cnt ul li a:after {content:""; position:absolute; top:50%; right:26px; margin-top:-13px; width:26px; height:26px; border-radius:100%; background:#e1dace url("../images/main/arrow.png") 50% 50% no-repeat;}
.main-franchise .cnt ul li h3 {font-family:'LotteMartDream',sans-serif; font-size:22px; line-height:1.3em; letter-spacing:-.04em; margin-bottom:6px;}
.main-franchise .cnt ul li p {font-size:14px; font-weight:300; line-height:1.4em; letter-spacing:-.04em;}
.main-franchise .link-1 a:before {background-image:url("../images/main/franchise_icon1.png");}
.main-franchise .link-2 a:before {background-image:url("../images/main/franchise_icon2.png");}
.main-franchise .link-3 a:before {background-image:url("../images/main/franchise_icon3.png");}
.main-franchise .link-4 a:before {background-image:url("../images/main/franchise_icon4.png");}
.main-franchise .link-5 a:before {background-image:url("../images/main/franchise_icon5.png");}
.main-franchise .link-6 a:before {background-image:url("../images/main/franchise_icon6.png");}
.main-franchise .cnt ul li a:hover {border-color:#ed6ea7; background:#fff; color:#ed6ea7;}
.main-franchise .cnt ul li a:hover::after {background-color:#f18bb9; background-image:url("../images/main/arrow2.png");}
.main-franchise .link-1 a:hover::before {background-image:url("../images/main/franchise_icon1_on.png");}
.main-franchise .link-2 a:hover::before {background-image:url("../images/main/franchise_icon2_on.png");}
.main-franchise .link-3 a:hover::before {background-image:url("../images/main/franchise_icon3_on.png");}
.main-franchise .link-4 a:hover::before {background-image:url("../images/main/franchise_icon4_on.png");}
.main-franchise .link-5 a:hover::before {background-image:url("../images/main/franchise_icon5_on.png");}
.main-franchise .link-6 a:hover::before {background-image:url("../images/main/franchise_icon6_on.png");}

.main-brand {padding:100px 0;}
.main-brand .cnt ul {margin:0 -20px;}
.main-brand .cnt ul:after {content:""; display:block; clear:both;}
.main-brand .cnt ul li {float:left; width:25%; padding:0 20px;}
.main-brand .cnt ul li a {display:block; border-radius:20px; box-shadow:2px 2px 2px rgba(0,0,0,.20);}

.main-comm {padding:60px 0 55px; background:#ffedf5 url("../images/main/comm_bg.jpg") 50% 50% no-repeat;}
.main-comm .left {float:left; width:54%; padding-right:19px;}
.main-comm .right {float:left; width:46%;}
.main-comm .board-zone {height:236px; padding:25px 40px; background:#fff; border-radius:20px; box-shadow:1px 2px 2px rgba(0,0,0,.25);}
.main-comm .board-zone .inner {position:relative;}
.main-comm .board-zone h2 {color:#ed6ea7; font-family:'LotteMartDream',sans-serif; font-size:22px; line-height:1.3em; letter-spacing:-.04em; margin-bottom:13px; padding-bottom:12px; border-bottom:1px solid #dfdfdf;}
.main-comm .board-zone ul li {position:relative; height:32px; padding:0 80px 0 0; color:#505050; font-size:16px; line-height:32px; letter-spacing:-.04em;}
.main-comm .board-zone ul li a {display:inline-block; max-width:calc(100% - 25px); vertical-align:top; height:32px; overflow:hidden; white-space:nowrap; word-break:break-all; text-overflow:ellipsis;}
.main-comm .board-zone ul li a:hover {text-decoration:underline;}
.main-comm .board-zone ul li img {vertical-align:middle; display:inline;}
.main-comm .board-zone ul li span {position:absolute; top:0; right:0; font-size:14px;}
.main-comm .board-zone .more {position:absolute; top:6px; right:0; width:16px; height:16px;}
.main-comm .board-zone .more:before {content:""; position:absolute; top:0; left:50%; width:2px; height:100%; background:#505050; margin-left:-1px;}
.main-comm .board-zone .more:after {content:""; position:absolute; top:50%; left:0; width:100%; height:2px; background:#505050; margin-top:-1px;}
.main-comm .board-zone .more:hover::before,
.main-comm .board-zone .more:hover::after {background:#ed6ea7;}

.main-comm .bnr-link {position:relative; display:block; height:108px; padding:26px 160px 26px 40px; margin-bottom:20px; background:#fff; border-radius:20px; box-shadow:1px 2px 2px rgba(0,0,0,.25);}
.main-comm .bnr-link:last-child {margin-bottom:0;}
.main-comm .bnr-link:after {content:""; position:absolute; top:50%; right:43px; margin-top:-36px; width:86px; height:72px; background-position:50% 50%; background-repeat:no-repeat;}
.main-comm .bnr-link.type1:after {background-image:url("../images/main/comm_icon1.png");}
.main-comm .bnr-link.type2:after {background-image:url("../images/main/comm_icon2.png");}
.main-comm .bnr-link h2 {color:#ed6ea7; font-family:'LotteMartDream',sans-serif; font-size:20px; line-height:1.3em; letter-spacing:-.04em; margin-bottom:6px;}
.main-comm .bnr-link p {color:#2c2c2c; font-size:14px; line-height:1.5em; letter-spacing:-.04em;}

.main-quick {position:absolute; top:47px; padding-top:100px; right:25px; z-index:50;}
.main-quick.fixed {position:fixed;}

@media (max-width: 1400px){
	.main-notice {display:none;}
}

@media (max-width: 1260px){
	.main-home {height:calc(100vh - 80px); margin-bottom:0;}
}

@media (max-width: 1024px){
	.main-home .mv-txt1 img {height:34px;}
	.main-home .mv-txt2 img {height:95px;}
	.main-home .mv-txt3 {font-size:16px;}
	.main-home .mv-rabbit {top:12%; margin-left:290px;}
	.main-home .mv-rabbit img {width:70px;}
	.main-home .mv-bnr {padding:0 15px;}
	.main-home .mv-bnr div {padding:0 15px;}
	.main-home .mv-left img,
	.main-home .mv-right img {height:500px;}
	.page-loaded .mv-left {margin-left:-145px;}
	.page-loaded .mv-right {margin-right:-145px;}

	.m-head h2 {font-size:28px; background-size:70px auto; padding-top:58px;}

	.main-system {padding:50px 0 80px;}
	.main-system .cnt ul {margin:0 -12px;}
	.main-system .cnt ul li {padding:0 12px;}
	.main-system .cnt ul li .in {margin-top:-43px;}
	.main-system .cnt ul li i {width:54px; height:54px; background-size:contain; margin-bottom:10px;}
	.main-system .cnt ul li a {font-size:18px;}

	.main-franchise {padding:50px 0 80px;}
	.main-franchise .cnt ul {margin:-12px;}
	.main-franchise .cnt ul li {width:50%; padding:12px;}
	.main-franchise .cnt ul li a {height:132px; padding:28px 80px 28px 110px;}
	.main-franchise .cnt ul li a:before {width:54px; height:54px; margin-top:-27px; left:30px; background-size:contain;}
	.main-franchise .cnt ul li h3 {font-size:20px;}

	.main-brand {padding:50px 0 80px;}
	.main-brand .cnt ul {margin:0 -12px;}
	.main-brand .cnt ul li {padding:0 12px;}
}

@media (max-width: 860px){
	.main-home {height:auto; padding-bottom:120px;}
	.main-home .mv-txt1 {margin-top:60px;}
	.main-home .mv-txt1 img {height:26px;}
	.main-home .mv-txt2 {margin-top:-15px;}
	.main-home .mv-txt2 img {height:75px;}
	.main-home .mv-txt3 {font-size:14px;}
	.main-home .mv-rabbit {top:65px; margin-left:220px;}
	.main-home .mv-rabbit img {width:54px;}
	.main-home .mv-bnr {padding:0 10px;}
	.main-home .mv-bnr div {padding:0 10px;}
	.main-home .mv-left img,
	.main-home .mv-right img {height:400px;}

	.page-loaded .mv-left {margin-left:-125px;}
	.page-loaded .mv-right {margin-right:-125px;}

	.m-head {margin-bottom:40px;}
	.m-head h2 {font-size:26px; background-size:54px auto; padding-top:45px;}

	.main-system .cnt {max-width:600px; margin:0 auto;}
	.main-system .cnt ul li {width:33.33333333%; margin-bottom:20px;}
	.main-system .cnt ul li:nth-child(4) {margin-left:16.66666666%;}

	.main-franchise .cnt ul li a {height:117px; padding:25px 60px 25px 92px;}
	.main-franchise .cnt ul li a:before {width:50px; height:50px; margin-top:-25px; left:20px;}
	.main-franchise .cnt ul li a:after {right:20px;}
	.main-franchise .cnt ul li h3 {font-size:18px;}
	.main-franchise .cnt ul li p {font-size:12px;}

	.main-brand .cnt {max-width:500px; margin:0 auto;}
	.main-brand .cnt ul {margin:-15px;}
	.main-brand .cnt ul li {width:50%; padding:15px;}

	.main-comm .board-zone {padding:25px 25px;}
	.main-comm .board-zone ul li {font-size:14px;}
	.main-comm .bnr-link {padding:21px 90px 21px 25px;}
	.main-comm .bnr-link:after {width:60px; height:56px; background-size:contain; margin-top:-28px; right:20px;}
	.main-comm .bnr-link h2 {font-size:18px; margin-bottom:4px;}
	.main-comm .bnr-link p {font-size:13px;}
}

@media (max-width: 640px) {
	.main-home {padding-bottom:60px;}
	.main-home .mv-txt1 {margin-top:40px;}
	.main-home .mv-txt1 img {height:20px;}
	.main-home .mv-txt2 {margin-top:-10px;}
	.main-home .mv-txt2 img {height:53px;}
	.main-home .mv-txt3 {padding:0 15px; font-size:12px; margin-top:20px;}
	.main-home .mv-txt3 br {display:none;}
	.main-home .mv-rabbit {top:65px; margin-left:220px;}
	.main-home .mv-rabbit img {width:54px;}
	.main-home .mv-bnr {max-width:80%; padding:0; margin:20px auto 0; text-align:center;}
	.main-home .mv-bnr div {width:50%; padding:6px;}
	.main-home .mv-bnr img {width:100%;}
	.main-home .mv-left img,
	.main-home .mv-right img {height:340px;}

	.page-loaded .mv-left {margin-left:-100px;}
	.page-loaded .mv-right {margin-right:-100px;}

	.m-head {margin-bottom:22px;}
	.m-head h2 {font-size:24px; background-size:48px auto; padding-top:36px;}

	.main-system {padding:35px 0 40px;}
	.main-system .cnt ul {margin:0 -6px;}
	.main-system .cnt ul li {padding:0 6px; margin-bottom:12px;}
	.main-system .cnt ul li i {width:40px; height:40px; margin-bottom:6px;}
	.main-system .cnt ul li a {font-size:15px;}

	.main-franchise {padding:35px 0 40px;}
	.main-franchise .cnt ul {margin:-6px;}
	.main-franchise .cnt ul li {width:33.33333333%; padding:6px;}
	.main-franchise .cnt ul li a {height:110px; padding:15px 5px; border-width:2px; text-align:center; border-radius:12px;}
	.main-franchise .cnt ul li a:before {position:static; display:block; width:40px; height:40px; margin:0 auto 8px;}
	.main-franchise .cnt ul li a:after {display:none;}
	.main-franchise .cnt ul li h3 {font-size:15px;}
	.main-franchise .cnt ul li p {display:none;}

	.main-brand {padding:35px 0 40px;}
	.main-brand .cnt {max-width:500px; margin:0 auto;}
	.main-brand .cnt ul {margin:-7px;}
	.main-brand .cnt ul li {padding:7px;}

	.main-comm {padding:45px 0; background-size:cover; background-position:0 0;}
	.main-comm .left {float:none; width:auto; padding-right:0; margin-bottom:15px;}
	.main-comm .right {float:none; width:auto;}
	.main-comm .board-zone {height:226px; padding:23px 20px; border-radius:12px;}
	.main-comm .board-zone h2 {font-size:20px;}
	.main-comm .board-zone ul li {font-size:14px;}
	.main-comm .bnr-link {height:auto; padding:18px 90px 18px 20px; border-radius:12px; margin-bottom:15px;}
	.main-comm .bnr-link:after {right:16px;}
	.main-comm .bnr-link h2 {font-size:18px; margin-bottom:4px;}
	.main-comm .bnr-link p {font-size:13px;}
}