@charset "utf-8";

html{font-size:10px;}
.oh{overflow:hidden;}
.container {width:100%; margin:0 auto; max-width:1000px; position:relative;}
.cf:after{content:''; display: block; clear:both; visibility:hidden; height:0px;}
.eventName {max-width:2560px;margin:0 auto;text-align:center;letter-spacing:-0.5px;line-height:1.5;background:#efdfe8;}
.eventName .container {max-width: 1000px;}
.eventName .wrapper {padding: 6rem 0;}
.blind{position:absolute; left:-9999px; top:-9999px; font-size:0; width:0; height:0}

/* hr */
.con01 {height:auto; background:url(images_sg/con01_bg.jpg) no-repeat center top / cover;}
.con02 {height:auto; background:url(images_sg/con02_bg.jpg) no-repeat center top / cover;}
.con03 {height:auto; background:url(images_sg/con03_bg.jpg) no-repeat center top / cover;}

.con01 h2 {text-indent: -9999px; font-size: 0; position: absolute; top: -100%; left: -100%;}
.con01 .visual {display:inline-block; text-align: center; box-shadow: 20px 20px 0 #ff9c44;}

.con02 .content {display:flex; justify-content: center; align-items: center; margin-top: 3rem;}
.con02 .content .info {margin-left:3.4rem}
.con02 .content .info ul li {display:flex; justify-content: left; align-items: center; margin-top: 3.3rem;}
.con02 .content .info ul li:nth-child(1) {margin-top: 0}
.con02 .content .info ul li dl {margin-left: 3.4rem; text-align: left;}
.con02 .content .info ul li dt {font-size:2.8rem; font-weight:bold; color: #ff9c44;}
.con02 .content .info ul li dd {font-size:2rem; color:#333333;}
.con02 .content .info ul li dd:nth-child(3) {font-size:1.6rem; color:#727171}
.con02 .content .info p {margin-top: 3rem; font-size:1.5rem; color:#aca199}

.con03 .txt {margin: 6rem 0 3rem;}
.con03 .txt h3 {font-size:3.3rem; color:#5a3f00}
.con03 .txt h3 span {padding:0 10px; color:#fff; background-color: #ffb500;}
.con03 .txt p {margin-top: 2rem; font-size:2.2rem; color:#523a01}
.con03 .warn {margin-top:20px; font-size:1.8rem; color:#a0764b}

/* * Shop Btn */
.shop a {display: inline-block; padding: 14px 60px 15px; background-color: #000; font-size: 26px; color: #fff; border-radius: 50px; position: relative; font-weight:bold;}
.shop a span {margin-left: -5px;}
.shop a::after { content: ''; position: absolute; top: 43%; right:13%; transform: rotate(45deg); width: 12px; height:2px; background-color: #fff;}
.shop a::before {content: ''; position: absolute; top: 55%; right:13%; transform: rotate(-45deg); width: 12px; height:2px; background-color: #fff;}


@media screen and (max-width: 1040px){
	html{font-size:8px;}
	.container {width:95%;}
	.con01 .visual {margin: 0 3rem; box-shadow: 10px 10px 0 #ff9c44;}
	.con02 .tit {margin: 0 20px;}
	.con02 .content .thumb {max-width: 400px; width:100%;}
	.con02 .content .info ul li img {width:36%;}

}

@media screen and (max-width: 768px){
	html{font-size:7px;}
	.con02 .content {flex-direction: column;}
	.con02 .content .info {margin-top: 20px; margin-left: 0;}
	.con02 .content .info ul {margin-left:9%;}
	.con02 .content .info ul li img {width:27%;}

	.con03 .pdt {margin: 0 20px;}
	.con03 .txt h3{font-size:2.3rem; }
	.con03 .txt p {font-size:1.8rem; color:#523a01}

	/* * Shop Btn */
	.shop a {font-size: 18px;}
	.shop a::after {right:18%;}
	.shop a::before {right:18%;}

}

@media screen and (max-width: 480px){
	html{font-size:7px;}
	.con02 .content .thumb {max-width: 330px;}
}
