@charset "UTF-8";
/* CSS Document */

/* 愛鳥週間プレゼントキャンペーン */

/* 初期化 */

h3, h4, p, li { letter-spacing: 0.08em; font-feature-settings: "palt";}

/* 文字 */
h2 { font-size: 30px; color: #228FE3; line-height: 1.4em; text-align: center; margin: 0 0 40px 0; padding: 0;}
h3 { font-size: 24px;}
h4 { color: #333;}

@media screen and (max-width: 768px) {
	h2 { font-size: 25px;}
	h3 { font-size: 20px;}
}

/* pc版クリアランス */
.cl_pc80 { margin-bottom: 80px !important;}
.cl_pc50 { margin-bottom: 50px !important;}
.cl_pc30 { margin-bottom: 30px !important;}

@media screen and (max-width: 768px) {
.cl_pc80 { margin-bottom: 40px !important;}
.cl_pc50 { margin-bottom: 25px !important;}
.cl_pc30 { margin-bottom: 15px !important;}
}

/* smp版クリアランス */
.cl_sm20 { margin-bottom: 10px !important;}
.cl_sm40 { margin-bottom: 20px !important;}

@media screen and (max-width: 768px) {
.cl_sm20 { margin-bottom: 20px !important;}	
.cl_sm40 { margin-bottom: 40px !important;}	
}


#campaignvisual { width: 100%; height: 400px; margin-top: 80px; background-image: url("../images/header.jpg"); background-repeat: no-repeat; background-size: cover; background-position: right top; position: relative;}
#campaignvisual .h1_headline { width: 557px; height: 115px; background: url("../images/h1.png") no-repeat; background-size: 100% auto; position: absolute; top: 40%; left: 10%;}
.campaign_overview_wrapper { padding: 30px; min-height: 230px; background-color: #eef8ff; position: relative;}
.campaign_overview_wrapper ul { margin: 0; padding: 0; list-style-type: none; position: relative; z-index: 1;}
.campaign_overview_wrapper ul li { margin: 16px 0;}
.campaign_overview_wrapper ul li span { display: inline-block; width: 100px; padding: 6px; text-align: center; line-height: 1; color: #fff; background-color: #2591e0; margin-right: 16px;}
.campaign_overview_wrapper .cover { width: 40%; height: auto; position: absolute; top: 20px; right: 20px;}
.campaign_overview_wrapper .deco { width: 240px; transform: rotate(-6deg); position: absolute; top: -40px; left: 30px;}

ol { margin: 0 0 10px 25px; padding: 0;}
ul { margin: 0 0 10px 20px; padding: 0;}

.torigurashi_covers { display: flex; flex-wrap: wrap; justify-content: space-between;}
.torigurashi_covers div { width: 13%; margin: 0 0.642%;}
.torigurashi_covers div img { width: 100%; height: auto;}

@media screen and (max-width: 768px) {
	#campaignvisual { width: 100%; height: 160px;}
	#campaignvisual .h1_headline { width: 55%; background-size: 100% auto; left: 5%;}
	.campaign_overview_wrapper { padding: 20px 15px 20px 15px; background-size: 80% auto; background-image: none;}
	.campaign_overview_wrapper ul li span { display: block; margin: 0 0 10px 0;}
	.campaign_overview_wrapper .cover { position: relative; width: 100%; margin: auto !important; top: auto; left: 0; right: 0;}
	.campaign_overview_wrapper .deco { width: 160px; top: -30px; left: 10px;}
	.torigurashi_covers div { width: 48%; margin: 0 1% 20px 1%;}
}