@charset "utf-8";
/* CSS Document */

/* Common settings
--------------------------------------------------------- */
*,*:before,*:after{box-sizing:border-box}
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td{margin:0;padding:0;border:0;outline:0;font-size:100%;}
html {
  background-image:url("../img/bg.png");
  /*background-color:rgba(255,255,255,1);*/
  background-repeat:repeat;
	background-size:250px 250px;
  background-attachment:fixed;
  background-blend-mode:lighten;
  animation:none;
  }
body{
  font-family: dnp-shuei-mgothic-std, sans-serif;
  font-weight: 400;
  font-style: normal;
	color: #BC131E;
  }
html,body {
  height: 100%;
  margin: 0 auto;
  }
hr {height:0; margin:0;  padding:0; border:0;}
a {text-decoration:none;}
img {max-width:100%;}

/* NavigationMenu
--------------------------------------------------------- */
@media screen and (min-width:768px){
  #top-head {
    display: flex;
    width: 100%;
    height: 72px;
    background: rgba(255,255,255,0.6);
    position: fixed;
    z-index: 999;
		font-size: 1.1em;
		}
  #top-head .inner {
    width: 96%;
    margin: 0 auto;
    display: flex;
    justify-content: flex-end;
    align-items: center;
		}
  /*nav style*/
  #top-head nav ul {
    display: flex;
    list-style-type: none;
		}
  /*nav link style*/
  #top-head nav ul li a {
    text-decoration: none;
    padding: 0;
    margin: 1.5rem;
    color: #BC131E;
		position: relative;
    display: inline-block;
    transition: .3s;
		}
  /*#top-head nav ul li a:hover {color: #DAFF00;}*/
  #top-head nav ul li a::after {
    position: absolute;
    bottom: 0;
    left: 0;
    content: '';
    width: 0;
    height: 2px;
    background-color: #BC131E;
    transition: .3s;
		}
	#top-head nav ul li a:hover::after {width: 100%;}
/*  #top-head nav ul li a:before,  #top-head nav ul li a::after {
		content:'\25cf';
		padding: 0 0.2em;
    }*/
  #nav_toggle {display: none;}
}

@media screen and (max-width:767px){
/*hamburger menu style*/
#nav_toggle {
  position: absolute;
  top: 2em;
  right: 2em;
  z-index: 20;
	}
#nav_toggle div {
  position: relative;
  display: block;
  top: 4px;
  width: 32px;
  height: 32px;
  z-index: 100;
	}
#nav_toggle span {
  position: absolute;
  display: block;
  width: 100%;
  height: 4px;
  background: #BC131E;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
	}

/*hamburger menu close style*/
#nav_toggle span:nth-child(1) {top:0px;}
#nav_toggle span:nth-child(2) {top:10px;}
#nav_toggle span:nth-child(3) {top:20px;}

/*hamburger menu open style*/
.open #nav_toggle span:nth-child(1) {
  top: 10px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  transform: rotate(135deg);
	}
.open #nav_toggle span:nth-child(2) {
  width: 0;
  left: 50%;
	}
.open #nav_toggle span:nth-child(3) {
  top: 10px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  transform: rotate(-135deg);
	}
/*nav style*/
nav {
  position: absolute;
  padding: 2em;
  width: 100%;
  opacity: 0;
  z-index: 0;
  -webkit-transform: scale(0.85);
  -ms-transform: scale(0.85);
  transform: scale(0.85);
  transition: 0.5s;
	}
/*nav list style*/
nav ul {
  list-style-type: none;
  padding: 2em 0 0 0;
	}
nav ul li {
  border-bottom: 2px solid rgba(188, 19, 30, 1);
	}
/*nav link style*/
nav ul li a {
  padding: 1.5em 0;
  display: block;
  text-decoration: none;
  font-size: 1.250em;
  font-weight: bolder;
  color: #BC131E;
  transition: 0.5s;
	text-shadow: 0px 0px 5px #FFF, 0px 0px 5px #FFF;
	}
nav ul li a:hover {
  padding: 1.5em 1.0em;
  opacity: 0.5;
  transition: 0.5s;
	}
nav ul li:last-child {border: none;}
.add_nav {
  display: block;
  opacity: 1;
  z-index: 10;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  transition: 0.5s;
	}
.container {
	position: relative;
	max-width: 1240px;
	overflow:hidden;
	}
.add_container {
  -webkit-filter: blur(8px);
  -moz-filter: blur(8px);
  -o-filter: blur(8px);
  -ms-filter: blur(8px);
  filter: blur(8px);
  transition: 0.5s;
	}
}

/* Main
--------------------------------------------------------- */
.mainWrap *{box-sizing:content-box;}
.topArea {
	position: relative;
	height: 64vh;
	background-image:url("../img/topimage.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center top;
	min-height: 500px;
  }
.topArea .nadeshiko_logo{
	width:1240px;
  max-width:1000px;
  margin:0 auto 1rem;
  padding:7rem 0 2rem;
  text-align: center;
	line-height: 0;
  }
.topArea .nadeshiko_logo img{width: 70%;}
.topArea .leadtext{
	position: relative;
	text-align: center;
	margin: 0 auto;
	font-size: 1.3em;
	width:70%;
	height: 40px;
	text-shadow: 0px 0px 5px #FFF,0px 0px 5px #FFF,0px 0px 5px #FFF,0px 0px 5px #FFF;
  /*background: linear-gradient(transparent 70%, #DAFF00 30%);*/
  }
.topArea h2 .leadtext span{
	position: absolute;
	height: 40px;
	width:70%;
	}
	
.contArea{
	margin: 2rem auto 0;
	/*width: calc(100% - 30%);*/
	width: 1000px;
  }
.contArea h3{
	text-align: center;
  }
.teamWrap{
	display: flex;
	justify-content: center;
	width: 100%;
	margin: 0 auto;
  }
.teamWrap .team{
	background-color: #BC131E;
	color: #FFF;
	margin: 1rem 0.3rem;
	padding: 0.5em;
  }
.teamWrap .team p{
	text-align: center;
	margin: 0.2em;
  }
.teamname{margin-bottom: 2.3rem!important;}

@media screen and (max-width:767px){
	.topArea {height: 56vh;}
  .topArea .leadtext{
    background:none;
		width:95%;
		}
	.topArea .nadeshiko_logo{
    max-width:100%;
    padding:9rem 0 2rem;
		margin: 0;
		}
  .topArea .nadeshiko_logo img{width:95%;}
	.contArea{
    margin: 2rem auto 0;
    width: 95%;
		}
	.teamWrap{flex-direction:column;}
	.teamWrap .team p{font-size: 1.2rem;line-height: 1.5em;}
	.teamname{margin-bottom: 0!important;}
}


/* Category
-------------------------------------------------*/
.categoryarea{
  width: 100%;
  margin: 5em auto 1em;
	text-align: center;
  }
.categoryarea .icon{
  width: 160px;
  height: auto;
  margin: 0 auto;
  }
.categoryarea h3 {
  position: relative;
  padding: 0 65px;
  text-align: center;
	font-size: 1.5rem;
	}
.categoryarea h3:before {
  position: absolute;
  top: calc(50% - 1px);
  left: 0;
  width: 100%;
  height: 2px;
  content: '';
  background: #BC131E;
	}
.categoryarea h3 span {
  position: relative;
  padding: 0 1em;
	background-image:url("../img/bg.png");
  background-repeat:repeat;
	background-size:250px 250px;
  background-attachment:fixed;
  background-blend-mode:lighten;
  animation:none;
	z-index:5;
	}
@media screen and (max-width:767px){}

/* TeamList
-------------------------------------------------*/
.contArea ul , ul.teamList{
  list-style:none;
  padding:0;
  margin:0;
	max-height: 480px;
	}
.sclarea{overflow-y: scroll;}
.contArea ul li , ul.teamList li{
  /*border-bottom:1px solid #c4b496;*/
  padding:0.3em 0
	}
.contArea{margin-bottom:40px}
ul .teamList a [class^="c-"]{
  display:inline-block;
  width:5.5em;
  margin-right:.5em;
  color:#FFF;
  font-size:95%;
  text-align:center;
	}
.c-nippatsu, .c-nittaidai, .c-yamatos{
  margin-right: 0.5em;
  padding: 0.1em 0.5em;
	color: #FFF;
	display: inline-block;
	width: 4.5em;
	line-height: 1.3em;
	min-height: 1.3em;
	text-align: center;
	}
 .c-digest{
  margin-right: 0.5em;
  padding: 0.1em 0.5em;
	color: #FFF;
	display: inline-block;
	width: 6.5em;
	line-height: 1.3em;
	min-height: 1.3em;
	text-align: center;
	}
.label_dis{display: inline!important;}
.c-nippatsu{background:#00A0E9;}
.c-nittaidai{background:#003893;}
.c-yamatos{background:#F47001;}
.c-digest{background:#BC131E;}

@media screen and (max-width:767px){
  .contArea ul li,ul.teamList li{text-align:center;}
}


/* Button
-------------------------------------------------*/
.btnBox {
  text-align: center;
  padding: 0;
  }
.btnBoxL {
  text-align: center;
  padding: 0;
	margin: 4em auto;
  }
.btnAni {
  display: inline-block;
	position: relative;
  width: calc(100% - 20%);
  text-align: center;
  background-color: #FF1F35;
  border: 3px solid #FF1F35;
  color: #FF1F35;
  text-decoration: none;
  font-weight: 600;
  padding: 10px 24px;
	margin: 0.5em 0.25em 0.25em;
	font-size: 1.2em;
	}
.btnAni span {
  position: relative;
  z-index: 1;
	}
.btnAni::before, .btnAni::after {
  content: "";
  display: block;
  background-color: #FFF;
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  transition: .2s;
	}
.btnAni::before {left: 0;}
.btnAni::after {right: 0;}

.btnAni:hover:before, .btnAni:hover:after {
  width: 0;
	background-color: #FFF;
	}
.btnAni:hover {color: #FFF;}
@media screen and (max-width:767px){
	.btnAni{max-width: 100%;}
}

/* YouTube
-------------------------------------------------*/
.movieBox{
  width:75%;
  margin: 1em auto 4em;
  line-height: 2em;
  }
.movieBox h4{
  text-align: center;
	margin: 1.5rem auto;
	font-size: 1.2em;
	background: linear-gradient(transparent 70%, #DAFF00 30%);
	background-size:clac(100% - 10%)
  }
/* YouTube埋込 */
.youtube{
  position:relative;
  width:100%;
  padding-top:56.25%;
	border: solid 4px #BC131E;
	border-radius:4px;
  }
.youtube iframe {
  position:absolute;
  top:0;right:0;
  width:100% !important;
  height:100% !important;
  }
.cs img{
  width: 100%;
  margin: 0 auto;
  }
@media screen and (max-width:767px){
  .movieBox{width:95%;line-height:1.8em;}
  }


/* 下層
-------------------------------------------------*/
.archiveWrap{
  display: flex;
	justify-content: flex-start;
	width: 1000px;
	max-height: 560px;
	margin: 0 auto 5em;
	background-color: #FFF;
	box-shadow: 6px 6px rgba(188, 19, 30, 0.5);
  }
.archiveWrap .team{
	color: #BC131E;
	margin: 1rem 0.3rem;
	padding: 0.5em 1em;
	width: 100%;
  }
.archiveWrap .team ul li a{
  text-decoration: none;
  padding: 0;
  color: #BC131E;
  position: relative;
  display: inline-block;
  transition: .3s;
  }
.archiveWrap .team ul li a::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: '';
  width: 0;
  height: 2px;
  background-color: #BC131E;
  transition: .3s;
  }
.archiveWrap .team ul li a:hover::after {width: 100%;}
.contArea .archiveWrap ul li,ul .archiveWrap .teamList li{
  text-align:left;
  border-bottom:1.5px dashed #BC131E;
  }
.contArea h5 {
  position: relative;
  padding-left: 25px;
	font-size: 1.2em;
  }
.contArea h5::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  border: 4px solid #BC131E;
  border-radius: 100%;
  }
@media screen and (max-width:767px){
  .contArea .archiveWrap ul li,ul .archiveWrap .teamList li{
		text-align:left;
    }
	.archiveWrap{width:100%; }
	.archiveWrap .team ul li a::after{height: 1.5px;}
}

/* Scroll
-------------------------------------------------*/


/* footer
-------------------------------------------------*/
footer{
  display:-ms-flexbox;display:-webkit-box;display:-webkit-flex;display:flex;
  -ms-flex-wrap:wrap;-webkit-flex-wrap:wrap;flex-wrap:wrap;
  -ms-flex-pack:justify;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;
  margin-top: auto;
  padding:16px;
  font-size:0.9em;
  background-color: #BC131E;
  color: #FFF;
  }
.footLogo:hover{
  opacity: 0.6;
  transition-duration: 0.3s;
  }
.copyright{
  -ms-flex-flex-item-align:center;
	-webkit-align-self:center;
	align-self:center;
	margin: 0 auto;
  }
@media screen and (max-width:768px) {
  .footLogo, .copyright{margin: 0 auto;}
}

/* common
-------------------------------------------------*/
/* テキスト - SPのみ
------------------------*/
@media screen and (max-width:767px){
  .brSP:before{content:"\A";display:block}
  .hiddenSP,.forPC,.forTB{display:none}
}
/* テキスト - TBのみ
------------------------*/
@media screen and (min-width:768px) and (max-device-width:991px){
  .brTB:before{content:"\A";display:block}
  .hiddenTB,.forPC,.forSP{display:none}
}
/* テキスト - PC
------------------------*/
@media screen and (min-width:992px){
  .brPC:before{content:"\A";display:block}
  .hiddenPC,.forTB,.forSP{display:none}
}

.txtL{text-align:left}
.txtR{text-align:right}
.txtC{text-align:center}

.fontS{font-size:0.8em!important;}
.fontM{font-size:1.2em!important;}
.fontMM{font-size:1.3em!important; line-height:1.6em!important;}
.fontL{font-size:1.5em!important;line-height:1.8!important;}
.fontLL{font-size:2em}

.pl1em{padding-left:1em !important}
.pl2em{padding-left:2em !important}
.pb0{padding-bottom:0 !important}
.pb5{padding-bottom:5px !important}
.pb10{padding-bottom:10px !important}
.mb0{margin-bottom:0 !important}
.mb5{margin-bottom:5px !important}
.mb10{margin-bottom:10px !important}
.mb1em{margin-bottom:1em !important}
.mb2em{margin-bottom:2em !important}
.mb3em{margin-bottom:3em !important}
.mt0{margin-top:0 !important}
.mt5{margin-top:5px !important}
.mt10{margin-top:10px !important}
.ml0{margin-left:0 !important}
.ml5{margin-left:5px !important}
.ml10{margin-left:10px !important}
.mr0{margin-right:0 !important}
.mr5{margin-right:5px !important}
.mr10{margin-right:10px !important}

.lts1{letter-spacing:-1px;}
.lts2{letter-spacing:-2px;}

/* ScrollAnimation
------------------------ */
.fadeIn_left {
  opacity: 0;
  transform: translate(-50%, 0);
	}
.fadeIn_left.is-show {
  transform: translate(0, 0);
  opacity: 1;
	}
.fadeIn_left:nth-child(1){transition: 1.3s;}
.fadeIn_left:nth-child(2){transition: 0.9s;}
.fadeIn_left:nth-child(3){transition: 0.3s;}

.fadeIn_right {
  opacity: 0;
  transform: translate(50%, 0);
  transition: 0.8s;
	}
.fadeIn_right.is-show {
  transform: translate(0, 0);
  opacity: 1;
	}

.fadeIn_up {
  opacity: 0;
  transform: translate(0, 50%);
  transition: 0.8s;
	}
.fadeIn_up.is-show {
  transform: translate(0, 0);
  opacity: 1;
	}
@media screen and (max-width:768px) {
  .fadeIn_left:nth-child(1),.fadeIn_left:nth-child(2),.fadeIn_left:nth-child(3){transition: 0.8s;}
}