@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed');
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url(https://fonts.googleapis.com/earlyaccess/sawarabimincho.css);



/* =============================================================================
   リセットCSS
   ========================================================================== */

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,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,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}


/* =============================================================================
   clearfix
   ========================================================================== */
.clearfix:after {
	content: "";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
/* IE/Mac */
.clearfix{
	display: inline-table;
	zoom: 1;
}
/* Hide from IE/Mac, apply to IE/Win \*/
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}

.clear {
	clear: both;
	display: block;
}

body{
   overflow-y: scroll;
}

body.enabled_modal {
  overflow: hidden;
}

/* ---------------------------------------------------------------------------
   フォント色
   ---------------------------------------------------------------------------*/

.txt_red1{
	color:#C6002F;
}

.txt_red2{
	color:#CC5F7D;
}

.txt_pink1{
	color:#F30;
}

.txt_pink2{
	color:#E50065;
}

.txt_pink3{
	color:rgba(255,133,172,1.00);
}

.txt_blue1{
	color:#03F;
}

.txt_blue2{
	color:#09F;
}

.txt_green1{
	color:#396;
}

.txt_green2{
	color:#00A6A3;
}

.txt_green3{
	color:#7FBF39;
}

.txt_gray1{
	color:#999;
}

.txt_Purple1{
	color:#90C;
}

.txt_orange1{
	color:#F60;
}

.txt_yellow{
	color:rgba(245,236,153,1.00);
}


/* ---------------------------------------------------------------------------
   フォントサイズ
   ---------------------------------------------------------------------------*/

.fsize50{
	font-size:50%;
}

.fsize60{
	font-size:60%;
}

.fsize70{
	font-size:70%;
}

.fsize80{
	font-size:80%;
}

.fsize90{
	font-size:90%;
}

.fsize120{
	font-size:120%;
}


/* ---------------------------------------------------------------------------
   全般
   ---------------------------------------------------------------------------*/
html,body{
   min-width:1100px;
}

body{
	font-family: 'Noto Sans Japanese', "游ゴシック", YuGothic, "Helvetica Neue", Helvetica, Arial, "Hiragino Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	background-image:url(../images/top/bg_03.jpg);
	background-position:left bottom;
}

.sage{
    padding-left: 1em; 
    text-indent: -1em; 
}

.sage1_5{
    padding-left: 1.5em; 
    text-indent: -1.5em; 
}

.sage2{
    padding-left: 2em; 
    text-indent: -2em; 
}

.sage3{
    padding-left: 3em; 
    text-indent: -3em; 
}

.sage4{
    padding-left: 4em; 
    text-indent: -4em; 
}

ul, ol, dl {
	list-style-type: none;
}

h1,h2,h3,h4,h5,p,ol,ul,li,dl,dt,dd{
	margin:0;
	padding:0;
}

p{
	padding-top:10px;
}

img {
   vertical-align:bottom
}

::selection {
	background:rgba(72,130,217,1.00);
}
::-moz-selection {
	background:rgba(72,130,217,1.00);
}


/* ---------------------------------------------------------------------------
   テンプレート
   ---------------------------------------------------------------------------*/



#mobileHeader{
	display:none;
}


.stylePc{
	display:block;
}

.styleMobile{
	display:none;
}


/* =============================================================================
   アイソトープ
   ========================================================================== */

.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.4s;
     -moz-transition-duration: 0.4s;
      -ms-transition-duration: 0.4s;
       -o-transition-duration: 0.4s;
          transition-duration: 0.4s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}



/* ---------------------------------------------------------------------------
   TOPページ要素2
   ---------------------------------------------------------------------------*/





/* ---------------------------------------------------------------------------
   TOPページ要素
   ---------------------------------------------------------------------------*/

.visual_inner{
	position: relative;
	width: 100%;
}

.visual_image{
  width: 100%;
  height: auto;
}

  .visual_image img{
    width: 100%;
    height: auto;
  }

.visual_left-box{
	width: 55%;
	float: left;
}

	.visual_left-box img{
		width: 100%;
		height: auto;
	}




.visual_right_inner{
  position: absolute;
	width: 38.67%;
  top: 0;
  right: 0;
}


.v_r_i_logo{
	width: 95%;
	margin: 5% 4.8% 5% 0.2%;
}

	.v_r_i_logo img{
		width: 100%;
		height: auto;
	}

.v_r_i_ch01{
	width: 95%;
	margin: 0 5% 5% 0;
}

  .v_r_i_ch01 img{
		width: 100%;
		height: auto;
  }


.v_r_menu_wrapper{
  position: relative;
  overflow: hidden;
	width: 95%;
	margin: 0 4.8% 3% 0.2%;
}

  .v_r_menu_wrapper li{
    float: left;
  }
  
  .mw01{
    width: 31.9%;
    height: auto;
  }
  
  .mw02{
    width: 36.2%;
    height: auto;
  }
  
  .v_r_menu_wrapper li img{
    width: 100%;
    height: auto;
  }
  
  .v_r_menu_wrapper li.lih:hover{
    background-image: url(../images/top/v03/menu/b_on.png);
    background-position: center left;
    background-repeat: no-repeat;
    background-size:contain;
  }


.visual_right_inner2{
  position: absolute;
	width: 38.67%;
  bottom: 0;
  right: 0;
}



.info_wrapper{
}

.info-area{
	position:relative;
	overflow:hidden;
	width:100%;
	height:auto;
  
}

	.bg02{
		position:relative;
		overflow:hidden;
		width:100%;
		background-image:url(../images/top/bg_info2.png);
	}




.news-content{
	position:relative;
	overflow:hidden;
	width:100%;
	margin: auto;
}

.news-head{
	padding:0 20px 0 20px;
  height: 20px;
  background-color: rgba(0,0,0,0.60);
}

	.news-head img{
		height:100%;
		width:auto;
	}

.news-box{
	position:relative;
	overflow:auto;	
  padding: 0 20px 0 20px;
	margin:auto;
  background-color: rgba(0,0,0,0.60);}



.twitter-content{
	position:relative;
	overflow:hidden;
	width:100%;
	margin: auto;
}

.twitter-head{
	padding:0 20px 0 20px;
  height: 20px;
  background-color: rgba(0,0,0,0.60);
}

	.twitter-head img{
		height:100%;
		width:auto;
	}

.twitter-box{
	position:relative;
	overflow:auto;	
  padding: 0 20px 0 20px;
	margin:auto;
  background-color: rgba(0,0,0,0.60);
	overflow:auto !important;
	-webkit-overflow-scrolling:touch !important;
}





.news-box .day{
	color:rgba(255,255,255,1.00);
	font-family: 'Noto Sans Japanese', "游ゴシック", YuGothic, "Helvetica Neue", Helvetica, Arial, "Hiragino Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-weight:400 !important;
	font-size:12px !important;
  line-height: 1.2;
}

.news-box .title{
	color:rgba(255,255,255,1.00);
	font-family: 'Noto Sans Japanese', "游ゴシック", YuGothic, "Helvetica Neue", Helvetica, Arial, "Hiragino Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-weight:400;
	font-size:13px;
	margin-bottom:7px;
	padding-bottom:7px;
	border-bottom:rgba(84,81,79,1.00) 1px dotted;
}

	.news-box .title a{
		color:rgba(255,255,255,1.00);
		text-decoration:none;
	}

	.news-box .title a:hover{
		color:rgba(255,255,255,1.00) !important;
		text-decoration:underline;	}

	.news-box .title a:visited{
		color:rgba(255,255,255,1.00);
		text-decoration:none;
	}


.info_brk{
  background-color: rgba(0,0,0,0.60);
}











#menu-area{
	position:relative;
	overflow:hidden;
	width:100%;
	height:218px;
	background-image:url(../images/top/bg_03.jpg);
	background-position:left top;
}

	.menu-inner{
		width:900px;
		margin:auto;
	}
	
	.menu-inner li{
		float:left;
	}





.info-contents{
	position:relative;
	overflow:hidden;
	width:924px;
	height:377px;
	margin:20px auto auto auto;
}






#pv-area{
	position:relative;
	overflow:hidden;
	width:100%;
	height:460px;
}

#pv-area .pv01{
	width:720px;
	height:405px;
	margin:27.5px auto auto auto;
	border:rgba(22,71,148,1.00) 1px solid;
	background-color: rgba(255,255,255,1.00);
}

	.pv01 a{
		color:rgba(0,0,0,1.00);
		text-decoration:none;
}
	
	.pv01 a:hover{
		opacity: 0.7;
		-webkit-transition: all .5s ease;
		-ms-transition: all .5s ease;
		transition: all .5s ease;
  	background-color: rgba(22,71,148,1.00);
}
	
	.pv01 a:visited{
		color:rgba(0,0,0,1.00);
		text-decoration:none;
	}
  

#pv-area .pv-bar01{
	position:absolute;
	top:50%;
	left:0;
	width:47.5%;
	height:1px;
	background-color:rgba(22,71,148,1.00);
}

#intro-area{
	position:relative;
	overflow:hidden;
	width:100%;
	font-family:"Sawarabi Mincho";
	font-weight:400;
	font-size:20px;
}

.intro-bar01{
	position:absolute;
	width:1px;
	height:130px;
  	top: 0;
  	left: 50%;
	background-color:rgba(22,71,148,1.00);
}


.intro-t01{
	position:relative;
	overflow:hidden;
	width:338px;
	height:630px;
	margin:106px auto 35px auto;
}

.intro-t02{
	position:relative;
	overflow:hidden;
	width:722px;
	height:55px;
	margin:0 auto 200px auto;
}

.bnr_old{
	position:relative;
	overflow:hidden;
	width:500px;
	height:172px;
	margin:0 auto 20px auto;
	padding-top:50px;
}

.bnr_area{
	position: relative;
	overflow: hidden;
	background-image:url(../images/top/bg_02.jpg);
	background-position:left top;
}

.bnr_wrap{
	position:relative;
	overflow:hidden;
	width:900px;
	margin:40px auto 40px auto;
	display: flex;
	justify-content: center;
   gap: 0 2%;
}

.bnr_wrap .box01{
	width: 48%;
}

.bnr_wrap .box01 img{
	width: 100%;
	height: auto;
}

.copy{
	width:500px;
	text-align:center;
	margin:auto;
	color:rgba(255,255,255,1.00);
	font-family: 'Noto Sans Japanese', "游ゴシック", YuGothic, "Helvetica Neue", Helvetica, Arial, "Hiragino Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-weight:400;
	font-size:60%;
	margin-bottom:100px;
}


.wrapper-innner-share{
	position:relative;
	overflow:hidden;
	width:220px;
	margin:auto;
	font-size:16px;
}


/*
Back to top button 
*/
#back-top {
    position: fixed;
    bottom: 3%;
    right: 50px;
	z-index:100;
}
#back-top span {
    width: 100px;
    height: 100px;
    display: block;
}


#logoanime{
  display: none;
	position:fixed;
	width:100%;
	height:100%;
	top:0;
  overflow: hidden;
  /*background-color: rgba(255,255,255,1.00);*/
  background-color: rgba(0,0,0,1.00);
  z-index: 1000;
}


.anime_t03{
   display: none;
 position: absolute;
  overflow: hidden;
  width: 400px;
  margin: auto;
  	top: 50%;
  	left: 50%;
  	transform: translateY(-50%) translateX(-50%);
  	-webkit- transform: translateY(-50%) translateX(-50%);
}

  .anime_t03 img{
    width: 100%;
    height: auto;
  }



/* 〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓
   スマホ版
   〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓 */

@media screen and (max-width: 480px) {


html,body{
	min-width:100%;
	max-width:100%;
}


img{
	width:100%;
	height:auto;
}



#mobileHeader{
	display:block;
	position:absolute;
	width:100%;
	height:50px;
  top: 0;
  right: 0;
  z-index: 100;
}


.anime_t03{
  width: 80%;
  margin: auto;
}

/* ---------------------------------------------------------------------------
   メニュー（モバイル）
   ---------------------------------------------------------------------------*/
	
#mobileMenu{
	display:block;
	position:fixed;
	z-index:2000;
	top:0;
	left:0;
	height:50px;
	width:100%;
}

	#mobileMenu .logo{
		position:absolute;
		width:150px;
		height:auto;
		z-index:2100;
		top:10px;
		left:10px;
	}
	
	#mobileMenu  .btn{
		width:150px;
		float:right;
	}

	#mobileMenu img{
		width:100%;
		height:auto;
	}
	

	#mobileHeader .logo{
	position: absolute;
	width: 202px;
	height: 35px;
	z-index: 2100;
	left: 3px;
	top: -10px;
	}
	
	#mobileHeader .logo img{
		width:100%;
		height:auto;
	}




/* ---------------------------------------------------------------------------
   テンプレート
   ---------------------------------------------------------------------------*/



 #wrapper-anime{
 	position: absolute;
	width:80%;
  	top: 50%;
  	left: 50%;
}






.stylePc{
	display:none;
}

.styleMobile{
	display:block;
}



/* ---------------------------------------------------------------------------
   TOPページ要素
   ---------------------------------------------------------------------------*/

.visual{
	position:relative;
	overflow:hidden;
	width:100%;
	height:auto;
}

	.visual img{
		width:100%;
		height:auto;
	}
	
	
	.org{
		filter: blur(0px);
		transition: all 3s ease;
	 }



.visual-p01{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	overflow:hidden;
}


.visual-p02{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	overflow:hidden;
}

.visual-p03{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	overflow:hidden;
}

.visual-p04{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	overflow:hidden;
}

.visual-p05{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	overflow:hidden;
}


.bnr_wrap{
	position:relative;
	overflow:hidden;
	width:95%;
	margin:10px auto 20px auto;
	padding-top:50px;
	display: block;
}

.bnr_wrap .box01{
	width: 100%;
	margin-bottom: 20px;
}

.bnr_wrap .box01 img{
	width: 100%;
	height: auto;
}


#info-area{
	position:relative;
	overflow:hidden;
	width:100%;
	height:auto;
	background-image:url(../images/top/bg_03.jpg);
	background-position:left top;
}

	#info-area .bg02{
		position:relative;
		overflow:hidden;
		width:100%;
		height:auto;
	}


.info-contents{
	position:relative;
	overflow:hidden;
	width:90%;
	height:auto;
	margin:20px auto auto auto;
}

.news-content{
	width:100%;
	height:377px;
	float:none;
	margin:auto;
	margin-bottom:30px;
  background-color:rgba(0,0,0,0.60);
}

.news-head{
	width:90%;
	height:20px;
	margin:15px auto auto auto;
	padding-bottom:10px;
	border-bottom:rgba(160,160,160,1.00) 1px dotted;
  background-color:rgba(255,255,255,0.00);
}

	.news-head img{
		height:100%;
		width:auto;
	}

.news-box{
	position:relative;
	overflow:auto;	
  width:90%;
	height:300px;
	margin:auto;
	background-color:rgba(255,255,255,0.00);
}

.news-box .day{
	color:rgba(5,130,200,1.00);
	font-family: 'Noto Sans Japanese', "游ゴシック", YuGothic, "Helvetica Neue", Helvetica, Arial, "Hiragino Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-weight:400 !important;
	font-size:15px !important;
}

.news-box .title{
	color:rgba(84,81,79,1.00);
	font-family: 'Noto Sans Japanese', "游ゴシック", YuGothic, "Helvetica Neue", Helvetica, Arial, "Hiragino Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-weight:400;
	font-size:15px;
	margin-bottom:7px;
	padding-bottom:7px;
	border-bottom:rgba(84,81,79,1.00) 1px dotted;
}






.twitter-content{
	width:100%;
	height:377px;
	float:none;
	margin:auto;
	background-color:rgba(0,0,0,0.60);
	margin-bottom:20px;
}

.twitter-head{
	width:90%;
	height:20px;
	margin:15px auto auto auto;
	padding-bottom:10px;
	border-bottom:rgba(160,160,160,1.00) 1px dotted;
  background-color:rgba(255,255,255,0.00);
}

	.twitter-head img{
		height:100%;
		width:auto;
	}

.twitter-box{
	position:relative;
	overflow:auto;	width:90%;
	height:300px;
	margin:auto;
  background-color:rgba(255,255,255,0.00);
}



#pv-area{
	position:relative;
	overflow:hidden;
	width:100%;
	height:auto;
	background-image:url(../images/top/bg_02.jpg);
	background-position:left top;
}

#pv-area .pv01{
	width:90%;
	height:auto;
	margin:27.5px auto 27.5px auto;
	border:rgba(22,71,148,1.00) 1px solid;
}

#pv-area .pv-bar01{
	position:absolute;
	top:50%;
	left:0;
	width:48%;
	height:1px;
	background-color:rgba(22,71,148,1.00);
}

#intro-area{
	position:relative;
	overflow:hidden;
	width:100%;
	background-image:url(../images/top/bg_03.jpg);
	background-position:left top;
	font-family:"Sawarabi Mincho";
	font-weight:400;
	font-size:20px;
}

.intro-bar01{
	position:absolute;
	width:1px;
	height:130px;
  	top: 0;
  	left: 50%;
	background-color:rgba(22,71,148,1.00);
}


.intro-t01{
	position:relative;
	overflow:hidden;
	width:90%;
	height:auto;
	margin:106px auto 35px auto;
}

	.intro-t01 img{
		width:100%;
		height:auto;
	}

.intro-t02{
	position:relative;
	overflow:hidden;
	width:90%;
	height:auto;
	margin:0 auto 200px auto;
}

.bnr_old{
	position:relative;
	overflow:hidden;
	width:90%;
	height:auto;
	margin:0 auto 20px auto;
}

	.bnr_old img{
		width:100%;
		height:auto;
	}

.copy{
	width:100%;
	text-align:center;
	margin:auto;
	color:rgba(84,81,79,1.00);
	font-family: 'Noto Sans Japanese', "游ゴシック", YuGothic, "Helvetica Neue", Helvetica, Arial, "Hiragino Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-weight:400;
	font-size:60%;
	margin-bottom:100px;
}




}