@charset "UTF-8";
@import url("reset.css");
@import url("hed_787.css");
@import url("hamburger.css");
@import url("foot.css");

/* CSS Document 

/*************************************

*#waku全体枠内イメージ画像背面

**************************************/

#waku{
    padding: 0px;
   } 
/*:::::::::::::::::::::::::::::::::::::::::::::::::共通指示::::::::::::::::::::::::*/
#waku.fade{/*----------------フェードイン--*/
 opacity: 0;
   animation-name: fadein;
     z-index:-9999;
   animation-duration: 1.5s;
   animation-timing-function: ease-out;
   animation-fill-mode: forwards;
}

/*::::::::::::::::::スライドショー:::::::::::::::::::::::::*/
.photo li{
	max-width : 70% ;
    height: auto;
  
}

.photo li img{
    width: 100%;
}
.photoc img{
    width: 100%;
}
.slider_fade > li {
    position: absolute;
    z-index:  -9;
    right: 0;
	top:0;
    list-style: none;
    visibility: hidden;
    animation: anime_slider_fade 12s 0s infinite;
}
.slider_fade_no > li{
    position: absolute;
    z-index:  -9;
    right: 0;
	top:0;
    list-style: none;
    }
.slider_fade > li:nth-of-type(2) {
    animation-delay: 4s;
}
.slider_fade > li:nth-of-type(3) {
    animation-delay: 8s;
}

@keyframes anime_slider_fade {
    0% {
        visibility: visible;
        opacity: 0;
    }
    15% {
        opacity: 1;
    }
    33.3% {
        opacity: 1;
    }
    48.3% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

/*:::::::スライドショー:::::end:::::::*/
.back01 img{
	width: 25%;
	position:absolute;
	left: 0;
	top:250px;
	z-index:  -999;
	animation-name: fade;
  	animation-duration: 1s;/*1秒かけてフェードイン*/
  	animation-iteration-count: 1;/*1回*/
}


.back02 img{
	width: 25%;
	position:absolute;
	right:0;
	top:1000px;
	z-index:  -999;
	
}

.back03 img{
	width: 27%;
	position:absolute;
	left:0;
	top:1400px;
	z-index:  -999;

	
}
.back04 img{
	width: 20%;
	position:absolute;
    right: 0;
	top:2700px;
	z-index:  -999;
}
.back011 img{
	width: 25%;
	position:absolute;
	left: 0;
	top:30px;
	z-index:  -999;
	animation-name: fade;
  	animation-duration: 1s;/*1秒かけてフェードイン*/
  	animation-iteration-count: 1;/*1回*/
}
.back021 img{
	width: 25%;
	position:absolute;
	right:0;
	top:900px;
	z-index:  -999;
	}
.back031 img{
	width: 25%;
	position:absolute;
	left: 0;
	top:1860px;
	z-index:  -999;
	animation-name: fade;
  	animation-duration: 1s;/*1秒かけてフェードイン*/
  	animation-iteration-count: 1;/*1回*/
}
/*************************************************************************

*ヘッダーグローバルナビボックス

**************************************************************************/
#hed_waku{
	width: 100%;
	height: 80px;
   

}
/***********ヘッド内ロゴ＋グローバルナビフレックスボックス***********/
#hed_flexbox{
	display: flex;
	flex-wrap:nowrap;
	justify-content:space-between;
	max-width:90%;
	margin: 0 auto;	
	font-weight: 500;
	
}
/***********左ボックスロゴ***********************/	
h1{/*ロゴ*/
	width: 180px;
	padding-top: 25px;
	padding-bottom: 15px;
}
/***********右ボックスグローバルナビ***********/	
#g_navi{/*グローバルナビ*/
	margin-top: 35px;
	color: #00CCFF;
	
    font-size: 1.1vw;
	}

#g_navi ul{
	text-align: right;
	
}
#g_navi li{/*******グローバルナビ横並び*******/
	display:inline;
	font-weight: 400;
	font-family: 'M PLUS 1p', sans-serif;
	}
.nv{/*******メニュー*******/
	padding-left: 25px;
	padding-bottom: 10px;
	vertical-align: middle;	
	
	}
a{/*******メニューリンク*******/
	color: #000044;
	text-decoration: none;
	font-weight: 400;
	
}
a:hover{/*******メニューリンクマウスオーバー*******/
	
	color: #00CCFF;
	transition: 1.0s ;/*1秒かけて透過する*/
	}
.conta{/*******お問い合わせボタン*******/
	color: #00ccff;
	margin-left: 60px;
	white-space: nowrap;
	line-height: 5px;
	letter-spacing: 0.01em;
	font-weight:500;
	}
.conta_oto{/*******お問い合わせボタン*******/
	padding: 7px 22px 7px 22px;
    margin-left: 60px;
	background-color:#00CCFF;
	border-radius:40px;
	color: #fff;
	text-shadow:none;
	font-weight:500;
	}

.conta a{/****お問い合わせボタンリンク装飾****/
	padding: 7px 22px 7px 22px;
	background-color:#000044;
	border-radius:40px;
	color: #fff;
	text-shadow:none;
	font-weight:500;
	
	}
.conta a:hover{
	color: #fff;
	padding: 7px 22px 7px 22px;
	letter-spacing: 0.01em;
	background-color:#00CCFF;
	border-radius:40px;
	transition: 1.0s ;/*1秒かけて透過する*/
	
}
/*************************************************************************

*ヒーロー部分キャッチコピー枠内

**************************************************************************/
#hed_tex{/*ヒーロフレックスボックス*/
width: 90%;	
margin: 0 auto;
color: #000044;
padding-top: 60px;
	}

.k_copy{/****キャッチコピーテキスト****/
	padding-bottom: 30px;
	font-size:30px;
	line-height: 1.6em;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-shadow:0 0 0.4em #FFF;
	font-feature-settings: "palt";/*カッコの文字空きを詰める*/
	}



.hed_tex_s{/****キャッチコピー下テキスト****/
	font-size: 1rem;
	letter-spacing: 0.05em;
	line-height: 1.5em;
	
}
.k_bt img{
	width: 220px;
	height: 50px;
	margin-top: 30px;
	box-shadow: 0 5px 5px 0 rgba(23, 36, 59, 0.1);/*画像ドロップシャドウ*/
	border-radius: 30px;
	
}
.k_bt_school img{
	width: 220px;
	height: 50px;
	margin-top: 10px;
	box-shadow: 0 5px 5px 0 rgba(23, 36, 59, 0.1);/*画像ドロップシャドウ*/
	border-radius: 30px;
	
}
.k_bt01 img{/*Productページボタン*/
	width: 275px;
	height: 50px;
	margin-top: 30px;
	box-shadow: 0 5px 5px 0 rgba(23, 36, 59, 0.1);/*画像ドロップシャドウ*/
	border-radius: 30px;
	
}
.k_bt img:hover{
opacity: 0.5 ;/*透過*/
transition: 1.0s ;/*1秒かけて透過する*/
}
.k_bt01 img:hover,
.k_bt_school img:hover,
.k_bt05 img:hover
{
opacity: 0.5 ;/*透過*/
transition: 1.0s ;/*1秒かけて透過する*/
}

.k_bt05 {
text-align: center;
padding-top: 40px;


    
   
}

.k_bt05 img{/*Productページボタン*/
 
    
    width: 275px;
	height: 50px;
    box-shadow: 0 5px 5px 0 rgba(23, 36, 59, 0.1);/*画像ドロップシャドウ*/
	border-radius: 30px;
	
}










.demo_tex03.tsumeru {
}