@charset "utf-8";

@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 100;
	src:local("Noto Sans JP Thin"),
		url(../fonts/NotoSansJP-Thin.ttf);
}

@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 300;
	src:local("Noto Sans JP Light"),
		url(../fonts/NotoSerifJP-Light.ttf);
}

@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 400;
	src:local("Noto Sans JP Regular"),
		url(../fonts/NotoSansJP-Regular.ttf);
}
@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 500;
	src:local("Noto Sans JP Medium"),
		url(../fonts/NotoSansJP-Medium.ttf);
}
@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 600;
	src:local("Noto Sans JP SemiBold"),
		url(../fonts/NotoSansJP-SemiBold.ttf);
}
@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 700;
	src:local("Noto Sans JP Bold"),
		url(../fonts/NotoSansJP-Bold.ttf);
}
@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 800;
	src:local("Noto Sans JP Extra Bold"),
		url(../fonts/NotoSansJP-ExtraBold.ttf);
}
@font-face {
	font-family: 'Noto Sans JP';
	font-weight: 900;
	src:local("Noto Sans JP Black"),
		url(../fonts/NotoSansJP-Black.ttf);
}

/*common*/
/*********************/
#main .free_block ol,
#main .free_block ul {
  list-style: none;
  margin: auto;
}
.free_block h2 {
	padding: 0;
	border: none;
}
.free_block h2::before {
	display: none;
}

.flex {
	display: flex;
}
.flex.center {
	justify-content: center;
	align-items: center;
}
#main .free_block a.btn_apl[target=_blank]::after,
#main .free_block a.btn_ggl[target=_blank]::after{display: none;}


/*main*/
#main > .page_ttl,
#bread {display: none;}
#main .free_block .mb0 {margin-bottom: 0;}
.btn_c {
  display: flex;
  justify-content: center;
  align-items: center;
}
#main .free_block * {
	font-family: "Noto Sans JP", sans-serif;
}

#main {
	padding: min(3.4375vw, 66px) 0 min(12.5vw, 150px);
	background-image:
		url("../../images/event/winter_fair2025/bg_all.png");
	background-position: 
		50% 0;
	background-repeat: 
		repeat;
	background-size: 
		100% auto;
	position: relative;
}

#main .section {
	width: min(94vw, 1200px);
	border-radius: min(calc(1.5625vw * 1.75), 30px);
	background: #fff;
}

@media screen and (min-width:641px) {
	.img.sp,
	.sp {
		display: none;
	}
}
@media screen and (max-width:640px) {
	.img.pc,
	.pc {display: none;}

	#main {
		padding: min(5.6vw, 42px) 0 min(12vw, 90px);
	}
	#main .section {
		width: min(88vw, 1200px);
		border-radius: min(2.8vw, 20px);
	}
}

/*contents*/
#main .section:last-of-type {
	padding: min(2.65625vw, 50px) min(2.34375vw, 45px);
	margin-bottom: 0;
}

@media screen and (min-width:1300px) {
	#main .section:last-of-type {
		padding: 50px 45px;
	}
}
@media screen and (max-width:640px) {
	#main .section:last-of-type {
		padding: min(5.6vw, 40px) min(4vw, 30px) min(10.8vw, 80px) ;
	}
}

/*cnt title*/
#main .h2_ttl {
	color: #fff;
	font-size: clamp(2rem, 4.082vw, 4rem);
	font-weight: 700;
	border-radius: 4em;
	padding-bottom: .15em;
	margin-bottom: 21px;
	position: relative;
}
#main #garapon .h2_ttl {background-color: #4cc63a;}
#main #happy .h2_ttl {background-color: #e0261b;}
#main #coupon .h2_ttl {background-color: #00afdd;}
#main #present .h2_ttl {background-color: #07a849;}
#main .h2_ttl::before,
#main .h2_ttl::after {
	content: '';
	display: block;
	background-size: 100% auto;
	position: absolute;
}
#main .h2_ttl::before {
	width: min(10vw, 120px);
	height: min(3.3333vw, 40px);
	background: url(../../images/event/winter_fair2025/cnt_ttl_dcL.svg) 0 0 no-repeat;
	left: -5px;
	top: -13%;
}
#main .h2_ttl::after {
	width: min(10.75vw, 129px);
	height: min(3.75vw, 45px);
	background: url(../../images/event/winter_fair2025/cnt_ttl_dcR.svg) 0 0 no-repeat;
	top: -15%;
	right: -5px;
}
#main #garapon .h2_ttl {
	padding-bottom: 0;
}
#main #garapon .h2_ttl .wp {
	padding-bottom: .15em;
	padding-left: min(16.75vw, 200px);
	position: relative;
}
#main #garapon .h2_ttl .img {
	margin: 0;
	padding: 0;
	width: min(15vw, 183px);
	position: absolute;
	bottom: -1px;
	left: 0;
}

#main .h3_ttl {
	color: #fff;
	font-size: clamp(1.4rem, 2.858vw, 2.8rem);
	font-weight: 700;
	text-align: center;
	padding: .3em 0;
	margin-bottom: min(2.5vw, 30px);
	background-color: #4cc63a;
	border-radius: 4em;
}

@media screen and (min-width:641px) {
	#main .h2_ttl .sml {
		font-size: clamp(1.25rem, 2.552vw, 2.5rem);
		font-weight: 500;
		margin-bottom: .3em;
		margin-right: .5em;
	}
	#main .h2_ttl {
		height: min(7vw, 72px);
		display: flex;
		justify-content: center;
		align-items: flex-end;
	}
}
@media screen and (min-width:1200px) {
	#main .h2_ttl {
		padding-bottom: .2em;
	}
	#main .h2_ttl::before {
		top: -11px;
	}
	#main .h2_ttl::after {
		top: -14px;
	}
	#main #garapon .h2_ttl .wp {
		padding-bottom: .2em;
	}
}
@media screen and (max-width:640px) {
	#main .h2_ttl {
		font-size: clamp(2.2rem, 5.73vw, 4.4rem);
		line-height: 1.2;
		height: auto;
		display: block;
		text-align: center;
		padding: .5em 0 .6em;
		margin-bottom: min(3.6vw, 28px);
	}
	#main .h2_ttl .sml {
		font-size: clamp(1.8rem, 4.688vw, 3.6rem);
		display: inline-block;
		transform: translate(0.15em, -0.05em)
	}
	#main .h2_ttl::before {
		width: min(22vw, 165px);
		height: min(7.6vw, 55px);
		background: url(../../images/event/winter_fair2025/cnt_ttl_dcL_sp.svg) 0 0 no-repeat;
		left: 0;
		top: min(-0.4vw, -18px);
		top: -10%;
	}
	#main .h2_ttl::after {
	width: min(21.2vw, 159px);
	height: min(9.2vw, 68px);
	background: url(../../images/event/winter_fair2025/cnt_ttl_dcR_sp.svg) 0 0 no-repeat;
	right: 0;
	top: -13%;
	}
	#main #garapon .h2_ttl::before {display: none;}
	#main #coupon .h2_ttl::before {top: -6%;}
	#main #coupon .h2_ttl::after {top: -10%;}

	#main #garapon .h2_ttl {
		text-align: left;
		padding: 1.12em 0;
		padding-left: min(22.8vw, 171px);
	}
	#main #garapon .h2_ttl .wp {
		position: static;
		padding: 0;
	}
	#main #garapon .h2_ttl .img {
		width: min(22.4vw, 166px);
		height: min(22.4vw, 166px);
		left: 0;
		bottom: -1px;
	}
	#main .h3_ttl {
		font-size: clamp(1.7rem, 4.428vw, 3.4rem);
		padding: .5em 0;
		margin-bottom: min(4vw, 30px);
	}
}

/*read*/
#main .read_txt {
	color: #000;
	font-size: clamp(0.8rem, 1.634vw, 1.6rem);
	font-weight: 600;
	margin-bottom: 1.2em;
}
.info_dl {
	font-weight: 600;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: min(.9166vw, 10px);
}
.info_dl.mb {
	margin-bottom: min(2.75vw, 30px);
}
.info_dt {
	color: #fff;
	font-size: clamp(0.8rem, 1.634vw, 1.6rem);
	text-align: center;
	background-color: #4cc63a;
	width: min(9.25vw, 111px);
	padding: .1em 0 .2em;
	margin-right: 1.3em;
	border-radius: 5px;
}
.info_dd {
	font-size: clamp(0.8rem, 1.634vw, 1.6rem);
}

@media screen and (min-width:641px) {
	#main .read_txt {
		text-align: center;
	}
}
@media screen and (max-width:640px) {
	#main .read_txt {
		font-size: clamp(1.3rem, 3.386vw, 2.6rem);
		margin-bottom: min(4vw, 30px);
	}
	.info_dl {
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
	}
	.info_dt {
		font-size: clamp(1.3rem, 3.386vw, 2.6rem);
		width: min(24vw, 180px);
		padding: .1em 0 .3em;
		margin-right: 0;
		margin-bottom: .4em;
	}
	.info_dd {
		font-size: clamp(1.5rem, 3.908vw, 3rem);
	}
	.info_dl.mb {
		margin-bottom: min(4vw, 30px);
	}
}

/*list*/
.list_garapon .list_gp {
	line-height: 0;
}
.list_coupon,
.list_happy {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.wp_cmp {
	display: flex;
	justify-content: center;
	margin-bottom: min(3.25vw, 40px);
}

#main #garapon .txt_m {
	font-size: clamp(0.7rem, 1.43vw, 1.4rem);
	margin-bottom: min(3.25vw, 39px);
}
#main .caution_txt {
	color: #d60029;
	font-size: clamp(1.2rem, 2.45vw, 2.4rem);
	font-weight: 800;
	text-align: center;
	margin-bottom: min(1.5vw, 18px);
}
.free_block img {
	margin-bottom: 0;
}

@media screen and (min-width:641px) {
	#main .list_garapon.__pc01 {
		margin-bottom: min(1.75vw, 20px);
	}
	#main .list_garapon.__pc02 {
		display: flex;
		justify-content: space-between;
		margin-bottom: min(1.75vw, 20px);
	}
	.list_garapon .list_gp._01 {
		width: min(49.16666666666667vw, 590px);
		margin-right: min(1.75vw, 20px);
		margin-bottom: 0;
	}
	.list_garapon .list_gp._02 {
		width: min(41.66666666666667vw, 500px);
	}
	#main .list_garapon.__pc03 {
		display: grid;
		grid-template-columns: 1fr 1fr 1.18fr;
		grid-template-rows: repeat("2", "1fr");
		grid-column-gap: min(1.75vw, 20px);
		grid-row-gap: min(1.75vw, 20px);
		margin-bottom: min(1.25vw, 15px);
	}
	.list_gp._03 {
		grid-area: 1 / 1 / 3 / 2;
	}
	.list_gp._04 {
		grid-area: 1 / 2 / 2 / 3;
	}
	.list_gp._05 {
		grid-area: 2 / 2 / 3 / 3;
	}
	.list_gp._sponsor {
		grid-area: 1 / 3 / 3 / 4;
		grid-template-columns:min(32.5vw, 390px);
	}

	.list_happy .li_hp {
		width: min(49%, 545px);
		margin-bottom: min(1.25vw, 15px);
	}
	.list_coupon .li_coupon {
		width: min(49%, 545px);
		margin-bottom: min(2.75vw, 33px);
	}

	.wp_cmp .img {
		width: min(56.75vw, 680px);
	}
}
@media screen and (min-width:768px) {
	#main .list_garapon.__pc03 {
		grid-template-columns: 1.02fr 1fr 1.18fr;
	}
}
@media screen and (min-width:1200px) {
}
@media screen and (max-width:640px) {
	.list_happy .li_hp,
	.list_coupon .li_coupon,
	.list_garapon .list_gp {
		margin-bottom: min(2.8vw, 20px);
	}
	.wp_cmp {
		margin-bottom: min(5.2vw, 40px);
	}
	#main #garapon .txt_m {
		font-size: clamp(1rem, 2.606vw, 2rem);
		margin-bottom: min(5.2vw, 40px);
	}
	#main .caution_txt {
		font-size: clamp(1.7rem, 4.428vw, 3.4rem);
		margin-bottom: min(3.6vw, 27px);
	}
}

/*botton*/
.btn_wp {
	display: flex;
	justify-content: center;
	align-items: center;
}
.btn_c {
	position: relative;
}
.btn_c::before {
	content: '';
	display: block;
	background-color: #9c9a9a;
	border-radius: 4em;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	z-index: 1;
	transform: translateY(5px);
}
.btn_c .btn {
	color: #ffea3c;
	font-size: clamp(1.2rem, 2.45vw, 2.4rem);
	font-weight: 700;
	text-align: center;
	text-decoration: none;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 4em;
	position: relative;
	z-index: 2;
	transition: all .3s;
}
#main .free_block .btn[target="_blank"]::after {display: none;}
.btn_c .btn .arrow {
	width: min(3vw, 34px);
	height: min(3vw, 34px);
	margin-right: min(1.5vw, 18px);
}
.btn .arrow_01 {fill:#ffea3c;}
.btn_c .btn:hover {
	transform: translateY(5px);
}
.btn_01 {
	background-color: #4cc63a;
}
.btn_01 .arrow_02 {fill:#4cc63a;}
.btn_01:hover .arrow_02 {fill:#3c9d2e;}
.btn_01:hover {background-color: #3c9d2e;}

.btn_02 {
	background-color: #00afdd;
}
.btn_02 .arrow_02 {fill:#00afdd;}
.btn_02:hover .arrow_02 {fill:#0086a9;}
.btn_02:hover {background-color: #0086a9;}

.btn_03 {
	background-color: #07a849;
}
.btn_03 .arrow_02 {fill:#07a849;}
.btn_03:hover .arrow_02 {fill:#047332;}
.btn_03:hover {background-color: #047332;}

.btn_04 {
	background-color: #d60029;
}
.btn_04 .arrow_02 {fill:#d60029;}
.btn_04:hover .arrow_02 {fill:#b70325;}
.btn_04:hover {background-color: #b70325;}


@media screen and (min-width:641px) {
	.btn_c .btn {
		width: min(46.75vw, 560px);
		height: min(5vw, 60px);
	}
}
@media screen and (max-width:640px) {
	.btn_c .btn {
		font-size: clamp(1.7rem, 4.428vw, 3.4rem);
		width: min(73.6vw, 550px);
		padding: .5em 0;
		position: relative;
	}
	.btn_c .btn .arrow {
		width: min(6.8vw, 50px);
		height: min(6.8vw, 50px);
		position: absolute;
		left: min(8vw, 60px);
		top: calc(50% - (min(6.8vw, 50px) / 2));
	}
}