@charset "utf-8";


/* --------------------------------------------------
   RESET
-------------------------------------------------- */

/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.8.0r4
*/

*, *:before, *:after {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;}

html{color:#000;background:#FFF;font-size:62.5%;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:1.6rem;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{*font-size:1.6rem;color:#404040;}input[type="button"]{border:0;}


/*input:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px #fff inset; background-color:#fff;}*/
input:-webkit-autofill {-webkit-transition: background-color 9999s; transition: background-color 9999s;}


/* --------------------------------------------------
   ELEMENT
-------------------------------------------------- */
body {
	color:#4c4c4c;
	font-family:'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	font-size:1.8rem;
	-webkit-text-size-adjust: 100%;
}
a, a:link, a:active, a:visited, select {color:#404040;cursor:pointer;}
img {vertical-align:bottom;}
dt {vertical-align:top;}
strong {font-weight:bold;}
label{font-size:24px;}
label{font-size:26px;}
.red {color:#cc1427;}

p.annotation {font-size:18px!important; color:#ff7f7f; padding-left:1em; text-indent:-1em; margin-top:10px;}
dt p.annotation {margin:20px auto 10px; width:600px; padding-bottom:5px;}

.mb0 {margin-bottom:0!important;}
.mb15 {margin-bottom:15px!important;}
.mb25 {margin-bottom:25px!important;}
.mb30 {margin-bottom:30px!important;}
.mb35 {margin-bottom:35px!important;}
.mb50 {margin-bottom:50px!important;}
.mb70 {margin-bottom:70px!important;}
.mb85 {margin-bottom:85px!important;}

.mt0 {margin-top:0!important;}
.mt15 {margin-top:15px!important;}
.mt25 {margin-top:25px!important;}
.mt30 {margin-top:30px!important;}
.mt35 {margin-top:35px!important;}
.mt50 {margin-top:50px!important;}
.mt70 {margin-top:70px!important;}
.mt85 {margin-top:85px!important;}

/* --------------------------------------------------
   HEADER
-------------------------------------------------- */
/*header {background:#a0a3c9;}*/
header {background:#979ac2;}
header h1 {width:630px; height:100px; margin:0 auto; padding-top:0;}

/* --------------------------------------------------
   MAIN
-------------------------------------------------- */
main {background:#f6f6f6;}
main a {color:#0000FF!important;}
main p {font-size:1.8rem; line-height:1.8; margin-bottom:30px;}
main p:last-of-type {margin-bottom:0;}
main p.large {font-size:2.6rem; font-weight: bold; margin: 50px auto 35px; color:#3d4062; border:none; text-align: center;}
main p.small {font-size:1.8rem;}
main h2 {font-size:2.8rem; text-align:center; color:#333; border-bottom:dotted #333 1px; border-top:dotted #333 1px; width:600px; margin: 0 auto 50px; padding:10px 0;}
main h3 {font-size:2.4rem; font-weight:bold; color:#42467a; margin:0 auto 15px;}
main img {display:block; margin:0 auto;}
main strong {color:#3d7e01;}

/* --------------------------------------------------
   CONTENTS
-------------------------------------------------- */
section {margin:0;}
section#sec_01 {width:100%; height:380px; background:url("../img/fig_01_back.png") #fff center no-repeat;}
section#sec_02 {padding:50px 0 100px;}
section#sec_02.top {padding:35px 0 100px;}
section.sec_reward {width:100%; height:300px; padding:35px 0 0!important; background:#a0a3c9;}
section.sec_reward p a {color:#FFF!important; display: inline-block; margin-top:10px;}
section#sec_03 {width:100%; padding-bottom:100px;}
section#sec_03 div.top {width:100%; height:300px; background:#88d1db;}
section div {width:630px; margin:0 auto;}
section div.twoRows {display:flex; margin-bottom:50px;}
section div.twoRows img {width:240px; height:140px; margin-right:20px;}
section div.twoRows div {width:350px; padding:10px 0 0;}
section div.twoRows div p {font-size:1.6rem; margin-bottom:0;}
section div.twoRows div h3 {font-size:2.1rem; line-height:1.4; padding-left:1em; text-indent:-1em;}
section section {width:630px; margin:0 auto!important; padding:0!important;}

section#sec_09 {padding-bottom:70px;}


/* --------------------------------------------------
   FUKIDASHI
-------------------------------------------------- */
div.fukidashiEX {
	margin: 0 auto 35px!important;
	padding: auto!important;
	border: none!important;
	border-radius: 8px!important;
	/*font-size: 1.0em!important;*/
}
div.fukidashiEX p {
	position: relative!important;
	background: #FFF!important;
	border-radius: 6px!important;
	margin:0!important;
	padding:1.0em 0.8em!important;
	text-align:left!important;
	font-size:1.3em!important;
	line-height: 1.6!important;
	filter: drop-shadow(2px 4px 4px rgba(0,0,0,0.2))!important;
}
div.fukidashiEX p:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 100%;
	margin-top: -10px!important;
	border: 10px solid transparent;
	border-left: 10px solid #FFF;
}
div.fukidashiEX p.left:before {
	content: "";
	position: absolute;
	top: 50%;
	left: -20px;
	margin-top: -10px;
	border: 10px solid transparent;
	border-right: 10px solid #FFF;
}
div.fukidashiEX p.long {
	font-size: 0.9em!important;
}
div.fukidashiEX p.big {
	font-size: 1.4em!important;
	line-height: 1.3!important;
}
div.fukidashiEX p.longstrong {
	font-weight:bold!important;
}

div.fukidashiEX.fpmR1 {
	background: url(../img/fkds-ex_back/fkds-ex_fpm_r1.png);
	background-size:cover!important;
	padding: 8% 32% 1.0em 0.8em!important;
}
div.fukidashiEX.fpmR2 {
	background: url(../img/fkds-ex_back/fkds-ex_fpm_r2.png);
	background-size:cover!important;
	padding: 8% 32% 1.0em 0.8em!important;
}
div.fukidashiEX.fpmL1 {
	background: url(../img/fkds-ex_back/fkds-ex_fpm_l1.png);
	background-size:cover;
	padding: 8% 0.8em 1.0em 32%;
}

div.fukidashiEX.fpwR1 {
	background: url(../img/fkds-ex_back/fkds-ex_fpw_r1.png);
	background-size:cover!important;
	padding: 8% 32% 1.0em 0.8em!important;
}
div.fukidashiEX.fpwL1 {
	background: url(../img/fkds-ex_back/fkds-ex_fpw_l1.png);
	background-size:cover;
	padding: 8% 0.8em 1.0em 32%;
}
div.fukidashiEX.fpwL2 {
	background: url(../img/fkds-ex_back/fkds-ex_fpw_l2.png);
	background-size:cover;
	padding: 8% 0.8em 1.0em 32%;
}

/* --------------------------------------------------
   FOOTER
-------------------------------------------------- */
footer h2 {text-align:left; font-size:2.1rem; font-weight:bold; margin:30px 20px;}
footer section div p {font-size:1.6rem; text-align:left; margin:0 20px 30px;}

footer p.copyright {font-size:1.2rem; padding:10px 0 30px;  text-align:center; border-top:1px dotted #333;}


/* --------------------------------------------------
   = spOnly
-------------------------------------------------- */
.spOnly {display:none;}

@media screen and (max-width:640px) {
	.spOnly {display:block;}
	.notSpOnly {display:none;}
}


/* --------------------------------------------------
   =Flushing
-------------------------------------------------- */

@keyframes flushing {
	0% {
        transform: scale(0) rotate(25deg);
        opacity: 0;
    }

    10% {
        transform: scale(1) rotate(25deg);
        opacity: 1;
    }

    25% {
        transform: scale(50) rotate(25deg);
        opacity: 0;
    }
	100% {
        transform: scale(0) rotate(25deg);
        opacity: 0;
    }
}

.flushing-btn {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    /*line-height: 40px;
    text-align: center;
    text-decoration: none;
    color: #ffffff;
    background: transparent;*/
    background: none;
    overflow: hidden;
}

.flushing-btn::after {
    content: '';
    position: absolute;
    top: -100px;
    left: -100px;
    width: 50px;
    height: 50px;
    background-image: linear-gradient(100deg,  rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 1) 100%, rgba(255, 255, 255, 0) 0%);
    
    /* アニメーション */
    animation-name: flushing;
    animation-duration: 5s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

a.flushing-btn {background:initial;}

/* --------------------------------------------------
   =clearfix
-------------------------------------------------- */
.cf:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.cf {
	display: inline-block;
}

/* Hides from IE-mac \*/

* html .cf {
	height: 1%;
	overflow: visible;
}

.cf {
	display: block;
}

/* End hide from IE-mac */
