@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:100,300,400,500,700,900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@300;400;700&display=swap');



/* ==============================================
setting
============================================== */

#sansan h1,#sansan h2,#sansan h3,#sansan h4,#sansan h5,#sansan p,#sansan li {
font-family: 'Roboto','Noto Sans JP', sans-serif;
}
#sansan h1,#sansan h2,#sansan h3,#sansan h4,#sansan h5,#sansan div,#sansan ul,#sansan li,#sansan p,#sansan a,#sansan strong,#sansan span {
box-sizing: border-box;
}
.sp{
display:none!important;
}
.red{
color: #dc0000;
}



/* ==============================================
#sansan
============================================== */

#sansan{
background: url("../images/ssm_bg.png") center top no-repeat;
}
#sansan .inner{
width: auto!important;
padding: 0!important;
margin: 0!important;
border: none!important;
background: none!important;
}



/* ==============================================
#sansan #sansan-hero
============================================== */

#sansan #sansan-hero{
background: url("../images/ssm_hr_bg.jpg") center top no-repeat;
margin: 5px 0 0 0;
}
#sansan #sansan-hero h1{
text-align: center;
}
#sansan #sansan-hero h1 img{
width: 100%;
height: 680px;
object-fit: cover;
}
#sansan #sansan-hero .inner{
margin: auto!important;
}
#sansan #sansan-hero .inner p{
font-size: 15px;
line-height: 27px;
letter-spacing: 0.4px;
font-weight: 500;
color: #222;
text-align: center;
margin: 0;
}



/* ==============================================
#sansan #sansan-present
============================================== */

#sansan #sansan-present{
position: relative;
width: 960px;
margin: 40px auto 0 auto;
padding: 0 0 64px 0;
}
#sansan #sansan-present .inner{
margin: 0 0 0 480px!important;
}
#sansan #sansan-present .inner h2{
font-size: 40px;
line-height: 48px;
letter-spacing: -0.8px;
font-weight: 900;
color: #6fb02c;
background: none;
position: relative;
margin: 0;
padding: 63px 0 0 56px!important;
}
#sansan #sansan-present .inner h2 span{
font-family: 'Roboto Condensed', sans-serif;
font-size: 120px;
line-height: 124px;
font-weight: 700;
display: block;
color: #6fb02c;
position: absolute;
top: 0;
left: -4px;
}
#sansan #sansan-present .inner .date{
font-size: 15px;
line-height: 19px;
letter-spacing: 0.4px;
font-weight: 700;
color: #004e8f;
text-align: center;
display: block;
width: 336px;
height: 32px;
background: #fff;
border-radius: 16px;
margin: 8px 0 0 0;
padding: 7px 0 0 0;
}
#sansan #sansan-present .inner .number{
position: absolute;
top: 16px;
right: -2px;
margin: 0;
}
#sansan #sansan-present .inner .number img{
width: 136px;
border-radius: 68px;
}
#sansan #sansan-present .inner .image{
position: absolute;
top: 16px;
left: 0;
margin: 0;
}
#sansan #sansan-present .inner .image img{
width: 420px;
}
#sansan #sansan-present .inner .image::after{
content: "";
background: url("../images/ssm_prs_icn.png");
background-size: 380px 380px;
width: 380px;
height: 380px;
position: absolute;
bottom: -230px;
left: -290px;
z-index: 1;
}



#sansan #sansan-present .inner div{
position: relative;
background: linear-gradient(0deg, #f0be50 0%, #f5a000 100%);
border-radius: 240px 240px 0 0;
margin: 32px 0 0 0;
padding: 0 0 32px 0;
}
#sansan #sansan-present .inner div h3{
font-size: 25px;
line-height: 33px;
letter-spacing: 0.8px;
font-weight: 700;
color: #fff;
text-align: center;
margin: 0 0 0 0!important;
padding: 60px 0 0 0;
}
#sansan #sansan-present .inner div h3 img{
position: absolute;
top: 16px;
left: -32px;
width: 112px;
z-index: 1;
}
#sansan #sansan-present .inner div h3 span{
font-size: 13px;
line-height: 21px;
letter-spacing: 0.4px;
font-weight: 700;
color: #fff;
display: block;
margin: 8px 0 0 0;
}
#sansan #sansan-present .inner div h3 + p{
font-size: 15px;
line-height: 27px;
letter-spacing: 0.4px;
font-weight: 400;
color: #fff;
text-align: justify;
margin: 24px 32px 0 32px!important;
}



#sansan #sansan-present .cmpn-offer{
background: #fff;
margin: 0;
padding: 16px 0 0 0;
width: auto;
}
#sansan #sansan-present .cmpn-offer .button + p{
font-size: 16px;
line-height: 24px;
letter-spacing: 0.4px;
font-weight: 400;
color: #222;
text-align: center;
margin: 16px 0 4px 0!important;
}



/* ==============================================
#sansan #cmpn-quiz
============================================== */

#sansan #cmpn-quiz{
margin: 0;
}
#sansan #cmpn-quiz h2{
background: url("../images/ssm_qz_ttl.png") center top no-repeat;
padding: 64px 0 0 0!important;
color: #fff;
}
#sansan #cmpn-quiz .cmpn-offer{
padding: 20px 0 0 0;
}
#sansan #cmpn-quiz .cmpn-offer .button + p{
font-size: 16px;
line-height: 24px;
letter-spacing: 0.4px;
font-weight: 400;
color: #222;
text-align: center;
margin: 16px 0 4px 0!important;
}



/* ==============================================
#sansan #sansan-link
============================================== */

#sansan #sansan-link .inner h2{
font-size: 31px;
line-height: 39px;
letter-spacing: 0.8px;
font-weight: 900;
color: #004e97;
text-align: center;
background: none;
margin: 0!important;
padding: 64px 0 0 0!important;
}
#sansan #sansan-link .inner h2 img{
width: 400px;
display: block;
margin: 0 auto 24px auto;
}
#sansan #sansan-link .inner ul{
margin: 40px 0 0 0;
}
#sansan #sansan-link .inner ul li{
text-align: center;
}



/* ==============================================
#sansan #sansan-support
============================================== */

#sansan #sansan-support{
width: 960px;
margin: auto;
padding: 64px 0 0 0;
}
#sansan #sansan-support .inner{
border: solid 4px #004e98!important;
border-radius: 16px!important;
}
#sansan #sansan-support .inner h2{
font-size: 21px;
line-height: 29px;
letter-spacing: 0;
font-weight: 900;
color: #004e98;
text-align: center;
background: none;
margin: 0!important;
padding: 24px 0 0 0!important;
}
#sansan #sansan-support .inner p{
font-size: 16px;
line-height: 24px;
letter-spacing: 0;
font-weight: 700;
color: #004e98;
text-align: center;
margin: 8px 0 0 0!important;
}
#sansan #sansan-support .inner figure{
margin: 16px 0 0 0;
padding: 0 0 32px 0;
text-align: center;
}