
@charset "utf-8";
/*=============================================================
Common Layout
=============================================================*/
/*=============================================================
MAIN
=============================================================*/
#ttlOuter{
}
#ttl{
width: 100%;
max-width: 1040px;
padding:0 20px;
box-sizing:border-box;
margin: 0 auto;
height:140px;
position:absolute;
bottom:35%;
left:50%;
transform:translate(-50%,0);
}
#ttlInner{
position:relative;
width:100%;
height:100%;
color:#fff;
line-height:1.25;
text-shadow:0px 0px 5px #000000,0px 0px 5px #000000;
}
#ttlTxt{
position:absolute;
bottom:0;
left:0;
right:0;
}
#ttlInner h1{
font-size:60px;
}
@media all and (-ms-high-contrast: none){
#ttlInner h1{
transform:translateY(30px);
}
}
#ttlLead{
width: 100%;
max-width: 1040px;
padding:0 20px;
box-sizing:border-box;
margin: 0 auto;
height:140px;
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,0);
}
#ttlLeadInner{
position:relative;
width:100%;
height:100%;
line-height:1.65;
}
#ttlLeadInner p{
font-size:18px;
position:absolute;
top:0;
left:0;
right:0;
}
@media all and (-ms-high-contrast: none){
#ttlLeadInner p{
transform:translateY(30px);
}
}

/*=============================================================
kokoro
=============================================================*/
.kokoro{
  margin: 3em auto 2em;
  text-align: center;
  background-color:#FEF9E3;
  color:#5F4113;
  padding: 2em;
  border-radius: 10px;
}
.kokoro .h2{padding-bottom: 0.5em;}
.kokoro ul {margin-top: 0;}
.kokoro li{
  margin-bottom: 1em;
  font-size: 1.2em;
}

/*=============================================================
#Selected
=============================================================*/
#Selected h2{
font-size:46px;
color:#806100;
/*  color:#cc9900;*/
text-align:center;
}
/*#kagaku
---------------------------------------------------*/
#kagaku{
background-color:#dabd1b;
text-align:center;
background-image: url(/contest/img/contest_bg.png);
}
#kagaku h3{
display:inline-block;
padding: 10px 36px;
font-size:36px;
color:#fff;
text-align:center;
position:relative;
}
@media all and (-ms-high-contrast: none){
#kagaku h3{
padding:17px 36px 3px;
}
}
#kagaku h3::before,
#kagaku h3::after{
content:"";
display:block;
width:36px;
height:70px;
background:url(/shared/img/icn_ttl_wh.png) no-repeat center center;
background-size:100% 100%;
position:absolute;
top:50%;
transform:translate(0,-50%);
}
#kagaku h3::before{
left:0;
}
#kagaku h3::after{
right:0;
transform:translate(0,-50%) scale(-1,1);
}
#kagaku .boxKagaku{
width:100%;
display:flex;
flex-wrap: nowrap;
justify-content: space-between;
margin:30px 0 0;
padding:30px;
box-sizing:border-box;
background-color:#fff;
border-radius:10px;
}
#kagaku .boxKagaku .boxPhoto{
width:400px;
order:2;
}
#kagaku .boxKagaku .boxDesc{
width:calc(100% - 420px);
text-align:left;
}
#kagaku .boxKagaku .boxDesc dt{
font-size:18px;
padding-bottom:5px;
}
#kagaku .boxKagaku .boxDesc dd{
padding:10px 0 5px;
border-top:1px solid #f2eee2;
}
@media all and (-ms-high-contrast: none){
#kagaku .boxKagaku .boxDesc dd{
padding:15px 0 2px;
}
}
/*#ikiiki
---------------------------------------------------*/
#ikiiki{
background-color:#f2eee2;
text-align:center;
}
#ikiiki h3{
display:inline-block;
padding: 10px 30px;
font-size:30px;
color:#806100;
/*  color:#cc9900;*/
text-align:center;
position:relative;
}
@media all and (-ms-high-contrast: none){
#ikiiki h3{
padding:15px 30px 5px;
}
}
#ikiiki h3::before,
#ikiiki h3::after{
content:"";
display:block;
width:29px;
height:56px;
background:url(/shared/img/icn_ttl_yellow.png) no-repeat center center;
background-size:100% 100%;
position:absolute;
top:50%;
transform:translate(0,-50%);
}
#ikiiki h3::before{
left:0;
}
#ikiiki h3::after{
right:0;
transform:translate(0,-50%) scale(-1,1);
}
#ikiiki .boxikiiki{
width:100%;
display:flex;
flex-wrap: wrap;
}
#ikiiki .boxikiiki .box{
margin-top:30px;
width:calc(33.333% - 20px);
box-sizing:border-box;
background-color:#fff;
border-radius:10px;
}
#ikiiki .boxikiiki .box:not(:nth-child(3n+1)){
margin-left:30px;
}
#ikiiki .boxikiiki .box figure{
padding:30px 30px 0px 30px;
}
#ikiiki .boxikiiki .box figure img{
width:100%;
}
#ikiiki .boxikiiki  .box.box_h figure img{
height:100% !important;
width:auto;
}
#ikiiki .boxikiiki .box dl{
text-align:left;
padding:20px 30px 0px 30px;
}
#ikiiki .boxikiiki .box dl dt{
font-size:16px;
padding-bottom:5px;
}
#ikiiki .boxikiiki .box dl dd{
padding:10px 0 5px;
border-top:1px solid #f2eee2;
}
/*#kirari
---------------------------------------------------*/
#kirari{
background-color:#F4F3F1;
text-align:center;
}
#kirari h3{
display:inline-block;
padding: 10px 30px;
font-size:30px;
color:#806100;
/*  color:#cc9900;*/
text-align:center;
position:relative;
}
@media all and (-ms-high-contrast: none){
#kirari h3{
padding:15px 30px 5px;
}
}
#kirari h3::before,
#kirari h3::after{
content:"";
display:block;
width:29px;
height:56px;
background:url(/shared/img/icn_ttl_yellow.png) no-repeat center center;
background-size:100% 100%;
position:absolute;
top:50%;
transform:translate(0,-50%);
}

#kirari h3::before{
left:0;
}
#kirari h3::after{
right:0;
transform:translate(0,-50%) scale(-1,1);
}
#kirari .boxkirari{
width:100%;
display:flex;
flex-wrap: wrap;
box-sizing:border-box;
background-color:#fff;
border-radius:10px;
padding:30px;
margin-top:30px;
}
#kirari .boxkirari li{
width:12.5%;
}
#kirari .boxkirari li figure{
border:1px solid #fff;
}
/*#matome
---------------------------------------------------*/
/* #matome {  background-color:#F8F8F8;} */

.boxmatome{
  margin-top: 30px;
  padding:30px;
background-color:#fff;
border-radius:10px;
}
.boxmatome p{
font-size:16px;
  text-align: left;
}
.boxmatome p+p{
padding:1em 0 0;
}
/*=============================================================
#bosyu
=============================================================*/
#bosyu{
background:#f2f2f2;
}
#bosyu .boxBosyu{
margin:30px 0 0;
padding:50px;
box-sizing:border-box;
background-color:#fff;
border-radius:10px;
}
#bosyu .boxBosyu h3{
text-align:center;
margin-bottom:30px;
padding:0 0 7px;
position:relative;
font-size:24px;
}
#bosyu .boxBosyu h3::after{
content:"";
display:block;
width:28px;
height:4px;
background-color:#ff0000;
position:absolute;
bottom:0;
left:50%;
transform:translateX(-50%);
}
#bosyu .boxBosyu h4{
width:136px;
text-align:center;
margin-bottom:10px;
padding:7px;
color:#fff;
border-radius:100px;
background-color:#ff0000;
line-height:1.0;
}
@media all and (-ms-high-contrast: none){
#bosyu .boxBosyu h4{
padding:12px 7px 4px;
}
}
#bosyu .boxBosyu p+h4{
margin-top:50px;
}
#bosyu .boxBosyu dl{
position:relative;
}
#bosyu .boxBosyu dl+dl{
margin:1em 0 0 0;
}
#bosyu .boxBosyu dl dt{
position: absolute;
top: 1px;
left: -3px;
font-weight:600;
}
#bosyu .boxBosyu dl dd{
padding:0 0 0 100px;
}
#bosyu .boxBosyu.houhou p{
  text-align: center;
}
#bosyu .boxBosyu.houhou dl{
margin:1em 0 0 0;
}
#bosyu .boxBosyu.houhou dl dd{
padding:0 0 0 200px;
}
#bosyu .boxBosyu p.btn{
width:100%;
max-width:400px;
margin:20px auto 0;
text-align:center;
}
#bosyu .boxBosyu p.btn {
display:block;
/*  background-color:#B8860B;*/
background-color:#338daa;
padding:10px;
color:#FFF;
text-decoration:none;
border-radius:100px;
}
#bosyu .boxBosyu p.btn.disabled{
color: #ffffff !important;
background-color: #8E8D9C !important;
opacity:.65;
}

@media all and (-ms-high-contrast: none){
#bosyu .boxBosyu p.btn a{
padding:13px 10px 7px;
}
  #bosyu .boxBosyu p.btn a:hover{
    background-color: #22708A;
  }
}
#bosyu .boxBosyu p.btn a span{
display:inline-block;
position:relative;
}
#bosyu .boxBosyu p.btn.pdf a span{
padding:0 0 0 24px;
}
#bosyu .boxBosyu p.btn.pdf a span::before{
content:"";
display:block;
width:18px;
height:18px;
background: url(/shared/img/icn_pdf.png) no-repeat center center;
background-size:100% 100%;
position:absolute;
top:3px;
left:0;
}
@media all and (-ms-high-contrast: none){
#bosyu .boxBosyu p.btn.pdf a span::before{
top:0px;
}
}
#bosyu .boxBosyu p.btn.arw a span{
padding:0 0 0 25px;
}
#bosyu .boxBosyu p.btn.arw a span::before{
content:"";
display:block;
width:26px;
height:26px;
border-radius:100px;
box-sizing:border-box;
border:3px solid #fff;
background:url(/shared/img/arw_white.png) no-repeat center center;
background-size:12px 12px;
position:absolute;
top:0;
left:-5px;
}
@media all and (-ms-high-contrast: none){
#bosyu .boxBosyu p.btn.arw a span::before{
top:-2px;
}
}
/*=============================================================
#card
=============================================================*/
.card-img {
padding: 0;
box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
border-top-left-radius: .25rem;
border-top-right-radius: .25rem;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
overflow: hidden;
}
.cid-rbmdr8RGdl .card-box {
border-bottom-left-radius: .25rem;
border-bottom-right-radius: .25rem;
background: #ffffff;
padding: 2rem;
box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
}
/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Smartphones
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media only screen and (max-width:767px), only screen and (max-device-width:767px){
/*=============================================================
MAIN
=============================================================*/
#ttlOuter{
position:relative;
}
#ttl{
width:100%;
height:auto;
background:none;
border-radius:0px;
position:absolute;
bottom:50%;
left:0;
transform:translate(0,0);
}
#ttlTxt{
padding:0px;
position:absolute;
bottom:0;
left:0;
right:0;
transform:translate(0,50%);
}
#ttlInner h1{
font-size:26px;
}
#ttlLead{
width:100%;
height:auto;
background:none;
border-radius:0px;
position:static;
transform:translate(0,0);
padding-top:10px;
}
#ttlLeadInner p{
position:static;
font-size:13px;
}

  /*=============================================================
  kokoro
  =============================================================*/
  .kokoro{
    padding: 1em 0.5em;
  }
  .kokoro li{
    font-size: 1em;
  }

/*=============================================================
#Selected
=============================================================*/
#Selected h2{
font-size:26px;
}
#kagaku h3{
padding: 10px 21px;
font-size:22px;
}
#kagaku h3::before,
#kagaku h3::after{
width:21px;
height:40px;
}
#kagaku .boxKagaku{
display:block;
padding:10px;
background-color:#fff;
border-radius:10px;
}
#kagaku .boxKagaku .boxPhoto{
width:100%;
}
#kagaku .boxKagaku .boxDesc{
display:block;
width:100%;
padding-top:20px;
}
#kagaku .boxKagaku .boxDesc dt{
font-size:16px;
}
/*#ikiiki
---------------------------------------------------*/
#ikiiki h3{
padding: 10px 21px;
font-size:22px;
}
#ikiiki h3::before,
#ikiiki h3::after{
width:16px;
height:30px;
}
#ikiiki .boxikiiki{
display:block;
}
#ikiiki .boxikiiki .box{
display:block;
width:calc(100%);
box-sizing:border-box;
border-radius:10px;
}
#ikiiki .boxikiiki .box:not(:nth-child(3n+1)){
margin-left:0px;
}
#ikiiki .boxikiiki .box figure{
padding:10px 10px 0px 10px;
}
#ikiiki .boxikiiki .box dl{
padding:20px 10px 0px 10px;
}
#ikiiki .boxikiiki .box dl dt{
font-size:14px;
padding-bottom:5px;
}
#ikiiki .boxikiiki .box dl dd{
padding:10px 0 5px;
border-top:1px solid #f2eee2;
}

/*#kirari
---------------------------------------------------*/
#kirari h3{
padding: 10px 21px;
font-size:20px;
}
#kirari h3::before,
#kirari h3::after{
width:16px;
height:30px;
}
#kirari p.atn{
font-size:12px;
}
#kirari .boxkirari{
padding:10px;
}
#kirari .boxkirari li{
width:33.33333%;
}
#kirari .boxkirari li figure{
border:1px solid #fff;
}

/*=============================================================
#bosyu
=============================================================*/
#bosyu .boxBosyu{
padding:10px;
}
#bosyu .h2{
font-size:26px;
}
#bosyu .boxBosyu h3{
text-align:center;
margin-bottom:30px;
padding:0 0 7px;
position:relative;
font-size:24px;
}
#bosyu .boxBosyu h3::after{
width:18px;
}
#bosyu .boxBosyu dl dt{
position:static;
}
#bosyu .boxBosyu dl dd{
padding:0 0 0 0;
}
#bosyu .boxBosyu.houhou dl dd{
padding:0 0 0 0;
}
#bosyu .boxBosyu p.btn a{
font-size:12px;
}
#bosyu .boxBosyu p.btn.pdf a span::before{
top:1px;
}
#bosyu .boxBosyu p.btn.arw a span::before{
border:2px solid #fff;
width:20px;
height:20px;
background:url(/shared/img/arw_white.png) no-repeat center center;
background-size:8px 8px;
top:0;
left:0;
}
}

/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Smartphones (portrait)
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media only screen and (max-width:540px){
}

/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Smartphones small (portrait)
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media only screen and (max-width:374px){
}

/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Print
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media print{
}



