@charset "utf-8";
/* ====================Initialization==================== */
html{margin:0;padding:0;width:100%;height:100%;font-size:62.5%;}
body{
width:100%;
height:100%;
margin:0;
padding:0;
background:#fff;/* ベース背景色 */
color:#333;/* ベース文字色 */
font-family: 'Noto Sans',Verdana, Roboto, "Droid Sans", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
font-size:16px;font-size:1.6rem;/* ベースフォントサイズ */
text-align:center;
line-height:1;
-webkit-text-size-adjust:none;
word-wrap:break-word;
overflow-wrap:break-word;
}
::-moz-selection{background:#ee859d;color:#fff;}
::selection{background:#ee859d;color:#fff;}
ul, ol{list-style:none;padding: 0;margin: 0;}
table{font-size:100%;}
figure{margin:0;}
figcaption{line-height:1;}
img{vertical-align:middle;border:0;}
input,textarea,button{
border:none;
padding:0;
margin:0;
background:transparent;
font-size:16px;font-size:1.6rem;
}
h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,
header,footer,article,section,nav,div,p,figure,aside,
table,th,td,input,textarea,a{
padding: 0;margin: 0;}
/* For modern browsers */
.cf:before,
.cf:after {
content:"";
display:table;
}
.cf:after {
clear:both;
}
/* ====================  共通  ==================== */
a{
outline: none;
display: block;
}
img{
width: auto;
max-width: 100%;
height: auto;
}
img[src$=".svg"] {
width: 100%;
}

/* ----------共通---------- */
a{display: block;}
img{
max-width:100%;
height: auto;
}

/* ==================== SP ==================== */

.sp{display: block;}
.pc{display: none;}

/* ----------共通---------- */
.secInner{
  margin: 0 auto;
}
.contentsArea{
  margin-top: 76.5%;
  padding: 0 0 10%;
  background: #ddd9d7;
  position: relative;
  z-index: 1;
}

/* ----------header---------- */
.header{
  position: fixed;
  top: 0;
  background: #fff100;
  width: 100%;
}
.header h1 .sp img{
  width: 100%;
  max-width: none;
}
.navArea{
  width: 100%;
  background: #fff;
  padding: 0;
  border-top: #ccc 1px solid;
  border-bottom: #ccc 1px solid;

  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;

  -webkit-transition: .3s ease;
     -moz-transition: .3s ease;
      -ms-transition: .3s ease;
       -o-transition: .3s ease;
          transition: .3s ease;

  text-align: left;
}
.gnav{
  background: #fff;
  border-bottom: #ccc 1px solid;
}
.gnav.fixed{
  position: fixed;
  top: 0;
  left: 0;
}

.navTtl{
  padding: 13px 0;
  float: left;
}
.navTtl h2{
  font-size: 1.8rem;
  color: #007bb1;
  font-weight: normal;
  font-weight: bold;
}
.navTtl p{
  color: #000;
  font-size: .9rem;
  display: block;
  text-align: left;
  margin-top: 5px;
  font-weight: bold;
}
.gnav{
width: 100%;
}
.gnav ul{
  width: 100%;
  text-align: center;
}
.gnav li{
  float: left;
  width: 25%;
  border-right: #ccc 1px solid;

  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
.gnav li:last-child{
  border-right: none;
}
.gnav a{
  color: #999;
  font-size: 1rem;
  text-decoration: none;
  height: 36px;
  line-height: 36px;
}

.topArea .tx{
  color: #013260;
  text-align: left;
  font-weight: bold;
  font-size: 1rem;
  line-height: 1.6;
  padding: 16px 10px;
}

.challengeBox{
  padding: 40px 10% 20px;
  text-align: left;
  border-bottom: #003260 4px solid;
  background: url("../images/bg_pattern.png") repeat;
}
.challengeBox figure{
  width: 89.84375%;
  margin: 0 auto 25px;
}
.challengeBox .ttl{
  color: #003260;
  font-size: 1.5rem;
  font-weight: bold;
  margin-bottom: 16px;
}
.challengeBox .tx{
  color: #003260;
  font-size: 1rem;
  line-height: 1.75;
  margin-bottom: 20px;
  font-weight: bold;
}
.challengeBox .nameTx{
  font-size: .7rem;
  color: #003260;
}

/* ----------footer---------- */
.footer{
  position: relative;
  background: #ee859d;
  color: #fff;
  font-size: 1.3rem;
  width: 100%;
  text-align: center;
  display: table;
}
.copyright{
  width: 100%;
  height: 40px;
  display: table-cell;
  vertical-align: middle;
}

/* ----------articleArea---------- */
.articleOuter{
  padding-top: 10px;
}
.articleArea{
  padding: 0 3.125%;
}
.articleImg{
  padding: 3.125% 0;
  border-bottom: #ccc 1px solid;
  margin-bottom: 8px;
}
.articleImg img{
  max-width: none;
  width: 100%;
}
.articleTx{
  background: #fff;
  padding: 8px 0;
  margin-bottom: 8px;
  text-align: left;
  border-bottom: #ccc 1px solid;
}
.articleTx h3{
  font-size: 1.2rem;
  margin-bottom: 10px;
  line-height: 1.2;
  border-left: #013260 2px solid;
  padding-left: 5px;
}
.articleTx h3 span{
  display: block;
  font-size: 0.8rem;
}
.detailTx{
  font-size: 0.96rem;
  line-height: 1.6;
  color: #626262;
}

/* articleBox */
.articleBox{
  width: 100%;
  display: table;
}
.articleBox div{
  display: table-cell;
  text-align: left;
  vertical-align: top;
}
.boxDetail{
  padding: 0 5px 0 10px;
}
.boxName{
  font-size: .9rem;
}
.boxName span{
  font-size: .7rem;
}
.boxImg,.boxLogo{
  width: 28.333%;
}
.boxTx{
  margin-top: 5px;
  font-size: 0.96rem;
  color: #007bb1;
  line-height: 1.2;
}

/* ==================== PC ==================== */
@media screen and (min-width:768px){
  .sp{display: none;}
  .pc{display: block;}

  .mouseOn{
  -webkit-transition: .3s ease;
     -moz-transition: .3s ease;
      -ms-transition: .3s ease;
       -o-transition: .3s ease;
          transition: .3s ease;
  }
  .mouseOn:hover{
  opacity: .7;
  }

  /* ----------共通---------- */
  .secInner{
    max-width: 1000px;
    margin: 0 auto;
  }
  .contentsArea{
    margin: 0 auto;
    margin-top: 76.5%;
    background: #fff;
    padding: 0;
    padding-bottom: 20%;
  }

  /* ----------header---------- */
  .navArea{
    width: 100%;
    padding: 0;
    height: 72px;
    position: relative;
    text-align: center;
  }
  .navTtl{
    padding: 0;
    display: inline-block;
    text-align: center;
    margin-top: 21px;
	  margin-left: 30PX;
  }
  .navTtl h2{
    font-size: 3.6rem;
  }
  .navTtl p{
    display: inline-block;
    width: 100%;
    text-align: center;
    font-size: 1.8rem;
    margin-top: 5px;
  }
  .gnav{
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    float: none;
    width: 100%;
  }
  .gnav li{
    float: left;
    width: 25%;
    margin-right: 0!important;
  }
  .gnav li:first-child{
    border-left: #ccc 1px solid;
  }
  .gnav li:last-child{
    border-right: #ccc 1px solid;
  }
  .gnav li a{
    height: 72px;
    line-height: 72px;
    font-size: 1.8rem;
    color: #999;
  }
  .gnav li a:hover{
    opacity: 0.7;
  }

  /* ----------topArea---------- */
  .topArea .tx{
    font-size: 2rem;
    padding: 50px 75px 60px;
    background: #fff;
  }

  .challengeBox{
    padding: 50px 40px;
    letter-spacing: -.4em;
  }

  .challengeBox figure.pc{
    letter-spacing: normal;
    display: inline-block;
    vertical-align: bottom;
    width: 40%;
    margin-bottom: 0;
  }
  .challengeBox .txChallenge{
    letter-spacing: normal;
    display: inline-block;
    vertical-align: bottom;
    width: 60%;
  }
  .challengeBox .ttl{
    font-size: 3rem;
  }
  .challengeBox .tx{
    font-size: 1.6rem;
    font-weight: bold;
  }
  .challengeBox .nameTx{
    font-size: 1.3rem;
    font-weight: bold;
  }


  /* ----------articleArea---------- */
  .articleArea{
    max-width: 1240px;
    padding: 28px 10px;
    margin: 0 auto;
    border-bottom: #ccc 1px solid;
  }
  .outer{
    width: 46%;
    float: left;
  }
  .articleTx h3{
    font-size: 2.4rem;
    line-height: 1.4;
    border-left: #013260 5px solid;
  }
  .articleTx h3 span{
    font-size: 1.6rem;
  }
  .articleImg{
    padding: 0;
    margin: 0;
    border: none;
    float: right;
    width: 52%;
  }
  .articleTx{
    padding: 0;
    background: #fff;
    text-align: left;
    margin-bottom: 18px;
  }
  .detailTx{
    font-size: 1.4rem;
    padding-bottom: 40px;
	font-weight: bold;
  }
/*  articleBox */
  .articleBox{
    width: 100%;
    display: table;
  }
  .articleBox > div{
    display: table-cell;
  }
  .boxTx{
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 1.4;
  }
  .boxName{
    font-size: 1.8rem;
  }
  .boxName span{
    font-size: 1.4rem;
  }

/* footer */
  .footer{
    display: block;
    height: 100px;
    padding: 24px 0 20px;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
  }
  .ftMenu{
    letter-spacing: -0.4em;
    text-align: center;
    margin-bottom: 32px;
  }
  .ftMenu li{
    letter-spacing: normal;
    display: inline-block;
  }
  .ftMenu li:first-child{
    border-right: #fff 1px solid;
    padding-right: 18px;
    margin-right: 18px;
  }
  .ftMenu li a{
    color: #FFF;
    font-size: 1.4rem;
    text-decoration: none;
  }
  .ftMenu li a:hover{
    text-decoration: underline;
  }
  .copyright{
    display: inline-block;
    height: auto;
    font-size: 1.3rem;
  }

}
@media screen and (min-width:1000px){
  .contentsArea{
    margin-top: 765px;
  }
}
@media screen and (min-width:1240px){
  /* ----------articleArea---------- */
  .articleArea{
    padding-left: 0;
    padding-right: 0;
  }
}