@charset "utf-8";

/* ---------------- */
:root {
	--base-color-blue: #0170fe;
	--base-color-skyblue: #60a9f6;
	--base-color-yellow: #f3ff00;
	--base-color-white: #f5f5fa;
	--btn-color: #0b1da0;
	--tx_base-color-black: #4f4f51;
	--font_main_sans-serif:"Noto Sans JP", sans-serif;
	--font-weight-regular:400;
	--font-weight-bold:700;
	--font-weight-black:900;
	--font-size-16px:clamp(0.875rem, 0.833rem + 0.18vw, 1rem);/* 14px-16px */
	--font-size-18px:clamp(0.813rem, 0.708rem + 0.45vw, 1.125rem);/* 13px-18px */
	--font-size-24px:clamp(1rem, 0.833rem + 0.72vw, 1.5rem);/* 16px-24px */
	--font-size-28px:clamp(1.313rem, 1.167rem + 0.63vw, 1.75rem);/* 21px-28px */
	--font-size-35px:clamp(1.563rem, 1.354rem + 0.9vw, 2.188rem);/* 25px-35px */
	--font-size-40px:clamp(1.25rem, 0.833rem + 1.8vw, 2.5rem);/* 40px-20px */
	--font-size-42px:clamp(1.75rem, 1.458rem + 1.26vw, 2.625rem);/* 24px-32px */
}

.wrap #right_side {
    padding-top: 0;
	font-weight: lighter;
}




/* ページタイトル */
#all_present #present_header h1 {
    width: 100%;
    background-color: transparent;
    border-radius: 10px;
    margin: 2% auto;
    text-align: center;
    filter: drop-shadow(2px 2px 3px #fff);
    display: flex;
}



h1 span {
    font-size: min(5vw, 80px);
    font-weight: var(--font-weight-regular);
    align-self: center;
}

h1 img {
    /*    width: min(20vw, 380px);*/
    width: 800px;
}

h1 a {
    display: block;
    margin: 0 auto;
}


/*---------------------プレゼント一覧ここから---------------------*/
/* 全賞品をまとめたdiv */
#present_list {
	max-width: 950px;
    line-height: 1.6em;
}

/* 賞品ひとつ分のdiv */
#present_list .pre_set {
    background-color: var(--base-color-white);
    border: solid 1px #bebebe;
    margin: 0 auto 3% auto;
    padding: 4%;
    position: relative;
    text-align: left;
}

/* プレゼント無いとき */
#present_list .pre_set_close {
    min-height: 500px;
    padding: 5%;
    text-align: center;
}

@media screen and (max-width:980px) {
	#present_list .pre_set_close {
    min-height: 200px;
	}
}
/* 賞品名 */
#present_list .pre_set h3.pre_name {
    background-color: #0349b7;
    border-radius: 5px;
    color: #fff;
    font-size: 1.2em;
    line-height: 1.2em;
    padding: 2% 3%;
    margin: 0 auto 3% auto;
	font-weight: var(--font-weight-bold);
	border-bottom: none;
}

/* 賞品詳細のdiv */
#present_list .pre_set .pre_detail {
    overflow: hidden;
    width: 100%;
}

/* 賞品画像＋説明文のdiv*/
#present_list .pre_set .pre_detail .pre_detail_top {
    width: 100%;
    overflow: hidden;
    padding-bottom: 3%;
}

/* 締切＋応募ボタンのdiv*/
#present_list .pre_set .pre_detail .pre_detail_bottom {
    clear: both;
    overflow: hidden;
    width: 100%;
}

/* 賞品画像 */
#present_list .pre_set .pre_detail .pre_detail_top .pre_pic {
    float: left;
    width: 40%;
}

#present_list .pre_set .pre_detail .pre_detail_top .pre_pic img {
    border-top: solid 1px #aaa;
    border-left: solid 1px #aaa;
    box-shadow: 1px 1px 5px #aaa;
    width: 100%;
}

/* 説明文 */
#present_list .pre_set .pre_detail .pre_detail_top .pre_memo {
    float: right;
    width: 54%;
	font-weight: var(--font-weight-regular);
}

/* 締切 */
#present_list .pre_set .pre_detail .pre_detail_bottom .pre_date {
    float: left;
    width: 40%;
}

/* 応募締切 */
#present_list .pre_set .pre_detail .pre_detail_bottom .pre_date span {
	color: #ff3e3e;
    display: block;
}

/* 応募ボタン */
#present_list .pre_set .pre_detail .pre_detail_bottom .pre_btn a {
    background: #116bfd;
    display: inline-block;
    width: 100%;
}

#present_list .pre_set .pre_detail .pre_detail_bottom .pre_btn a:link {
    background-color: #116bfd;
    border-radius: 50px;
    display: block;
    float: right;
    font-size: 1.2em;
    line-height: 1.2em;
    text-align: center;
    padding: 2% 3%;
    width: 48%;
}

#present_list .pre_set .pre_detail .pre_detail_bottom .pre_btn a:link,
#present_list .pre_set .pre_detail .pre_detail_bottom .pre_btn a:visited {
    color: #fff;
    text-decoration: none;
}
#present_list .pre_set .pre_detail .pre_detail_bottom .pre_btn a:hover {
	opacity: .7;
	transition: .3s;
}

@media screen and (max-width:600px) {
	#present_list .pre_set .pre_detail .pre_detail_top .pre_pic {
    float: none;
    width: 80%;
	margin: 4% auto;
	}
	#present_list .pre_set .pre_detail .pre_detail_top .pre_memo {
    float: none;
    width: 100%;
	font-weight: var(--font-weight-regular);
	}
	#present_list .pre_set .pre_detail .pre_detail_bottom .pre_date {
    float: none;
    width: 100%;
	}
	#present_list .pre_set .pre_detail .pre_detail_bottom .pre_btn a:link {
    width: 100%;
	}
	#present_list {
    margin-bottom: clamp(3.125rem, 2.083rem + 4.5vw, 6.25rem);
	}
	.pre_btn {
		
	}
	.pre_btn a {
		margin: 8% 0;
		padding: 5%!important;
	}	
}

/*---------------------プレゼント一覧ここまで---------------------*/

