@charset "UTF-8";
/* CSS Document */
body{
	margin: 0px;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	color: #333333;
	font-weight: 500;
	font-feature-settings: "palt" 1;
}
#top{
	background-color: #60c3dc;
	background-image: radial-gradient(circle, #ffffff99 10px, transparent 10px), radial-gradient(circle, #ffffff99 10px, transparent 10px);
	background-position: 0 0, 35px 70px;
	background-size: 70px 140px;
}
.kiyaku_container {
	background-color: #ffffff; /* 背景白 */
	border: 1px solid #cccccc; /* フレームの境界線（見やすくするため） */
	border-radius: 15px; /* 角丸20px */
	box-sizing: border-box;
	margin: 0px auto;
	overflow-y: scroll; /* ★ 高さを超えたらスクロール可能にする */
}
.youkou h2 {
	color: #fff;
	text-align: center;
}
.kiyaku_content {
	height: 300px; /* ★ 固定高さ */
	margin: 1em auto;
}
.kiyaku_content .no-marker {
    /* リストマーク（・、●など）を非表示にする */
    list-style: none;
    /* ※が左に寄りすぎないよう、左側の余白を調整 */
    margin-left: -20px; 
}
.kiyaku_content p, .kiyaku_content li {
	color: #333333;
	line-height: 1.6;
}
@media (min-width: 751px) {	
	.pc{
		display: block;
	}
	.sp{
		display: none;
	}
	body{
		font-size: 15px;
	}
	header{
		height: 70px;
	}
	header a{
		width: 80px;
		display: block;
		margin: 8px auto 5px 20px; 
	}
	header a img{
		width: 100%;
	}
	#top{
		padding: 30px 0px;
	}
	#top img{
		width: 70%;
		max-width: 1000px;
		margin: auto;
	}
	.top_text{
		margin: auto;
		width: 570px;
		margin-bottom: 50px;
	}
	h1{
		width: 780px;
		margin: auto;
		padding-top: 50px;
	}
	h1 img{
		width: 100%;
		margin: auto;
	}
	#prize{
		background: repeating-linear-gradient(-225deg, rgba(255, 244, 103, 1), rgba(255, 244, 103, 1) 30px, rgba(255, 244, 103, 0.6004672897196262) 0, rgba(255, 244, 103, 0.6004672897196262) 50px);
	}
	.prize_flex{
		display: flex;
		width: 780px;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: auto;
		padding-bottom: 30px;
	}
	.prize_flex img{
		width: 46%;
		margin-bottom: 50px;
	}
	#jouken{
		background-image: linear-gradient(165deg, rgba(235, 116, 30, 1) 50%, rgba(30, 113, 179, 1) 50%);
		padding-bottom: 40px;
	}
	.jokenn_inner{
		width: 780px;
		background-color: #fff;
		border-radius: 20px;
		margin: 30px auto;
		padding: 50px 0px 10px;
		text-align: center;
	}
	.point_text{
		width: 80%;
		margin: auto;
	}
	.account{
		margin: 2em auto;
	}
	.oubo_btn{
		width: 50%;
		margin: auto;
		text-align: center;
	}
	.oubo_btn p{
		font-size: 30px;
		margin: auto auto 10px auto;
	}
	.oubo_btn p span{
		content: "";
		background-image: url("../img/oubo_kazari.png");
		height: 32px;
		width: 32px;
		display: inline-block;
		background-size: cover;
		vertical-align: middle;
		margin: 0px 0.5em 5px 0.5em;
	}
	.oubo_btn a{
		width: 100%;
	}
	.oubo_btn img{
		width: 100%;
	}
	.oubo_att{
		list-style: none;
		width: 80%;
		text-align: left;
		margin: 2em auto;
		line-height: 2em;
	}
	.item{
		width: 85%;
		margin: 50px auto;
	}
	.item_title{
		width: 45%;
	}
	.item_1pt , .item_12pt{
		width: 100%;
		position: relative;
		margin-bottom: 50px;
	}
	.point_title{
		position: absolute;
		top: 20px;
		left: 0px;
		width: 123px;
	}
	.item_flex{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
		padding-top: 70px;
	}
	.item_flex img{
		width: 19%;
		margin: 2%;
	}
	.item_text{
		font-size: 30px;
		margin-top: 0px;
	}
	.item_text span{
		background-image: url("../img/milk_logo.png");
		width: 5em;
		height: 1.2em;
		background-size: 100%;
		display:inline-block;
		background-repeat: no-repeat;
		vertical-align: middle;
		margin-right: 0.2em;
	}
	.disney{
		text-align: left;
		font-weight: 400;
	}
	.milk_case{
		width: 83%;
		margin: 60px auto -30px;
	}
	
	.item_12pt ul{
		list-style: none;
		text-align: left;
	}
	.item_12pt li{
		text-indent: -1em;
		margin-left: -1em;
		margin-bottom: 0.7em;
		padding-left: 1em;
	}
	.ECshop{
		width: 100%;
		margin-bottom: 60px;
	}
	.ECshop p{
		font-size: 24px;
	}
	.EClink{
		display: flex;
		justify-content: space-around;
	}
	.EClink a{
		width: 40%;
	}
	.EClink img{
		width: 100%;
	}
	.oishisa{
		width: 85%;
		margin: auto;
		padding-bottom: 30px;
	}
	.oishisa img{
		width: 80%;
		margin-bottom: -6em;
	}
	.oishisa ul{
		width: 47%;
		text-align: left;
		list-style: none;
		margin: auto 5em 0px auto;
	}
	.oishisa li{
		text-indent: -1em;
		font-weight: 400;
	}
	#oubo{
		background-color: #60c3dc;
		padding-bottom: 30px;
	}
	.oubo_inner{
		background-color: #fff;
		border-radius:15px;
		width: 780px;
		margin: 20px auto;
		padding-bottom: 60px;
	}
	.step{
		width: 80%;
		margin: auto;
		padding-top: 40px;
	}
	.step_flex{
		display: flex;
		font-size: 22px;
		align-items: center;
	}
	.step_flex img{
		width: 45px;
		margin-right: 0.5em;
	}
	.step_flex:nth-of-type(3) p{
		margin-top: 2em;
		line-height: 1.2em;
	}
	.step_flex:nth-of-type(3) {
		margin-top: -0.5em;
	}
	.step_flex span{
		font-size: 15px;
	}
	.oubo_inner ul{
		list-style: none;
		width:80%;
		margin: 1em auto 2em;
		padding: 0px 0px 0px 1em;
		font-weight: 400;
		text-indent: -1em;
	}
	.oubo_inner li{
		margin-bottom: 0.5em;
	}
	.youkou{
		background-color: #eb741e;
		width: 780px;
		margin: 50px auto;
		padding-top: 3px;
		border-radius: 15px;
	}
	.kiyaku_container {
		width: 600px; /* 幅: 600px */
	}
	.kiyaku_content{
		width: 95%;
		padding-bottom: 2em;
	}
	.kiyaku_content h3 {
		color: #333333;
		font-size: 1em; /* ベースのフォントサイズに依存 */
		margin-top: 25px;
		margin-bottom: 10px;
	}
	.kiyaku_content p, .kiyaku_content li {
		font-size: 16px; /* フォントサイズ: 16px */
		margin-bottom: 10px;
	}
	
	.info{
		width: 460px;
		color: #fff;
		margin: 0px auto;
		padding-bottom: 30px;
	}
	.info h2{
		border-bottom: solid 1px #fff;
	}
	.info p{
		text-align: center;
		font-size: 20px;
	}
	.info p span{
		font-size: 16px;
	}
	.info ul{
		list-style: none;
		padding: 0px;
		text-indent: -1em;
		padding-left: 1em;
	}
	footer{
		height: 50px;
		padding-top: 10px;
		text-align: right;
	}
	footer img{
		width: 200px;
		margin: auto 50px auto auto;
	}
}