@charset "UTF-8";
/*!
Theme Name: hsc_ultimate
Version: 20200206
*/


/*カスタムセット*/
/*メインカラー設定*/

:root {
  --maincolor:rgba(64,98,157);
  --width:1240px;
}
.maincolor {color: var(--maincolor);}
.maincolor_bg {background-color: var(--maincolor);}
.maincolor_border { border-color:var(--maincolor)}





/*初期化*/
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
* { margin: 0px; padding: 0px; line-height:1.2; word-wrap: break-word; }
ul { list-style: none; }
ol  { display: block; text-align:left; list-style-position: outside; padding-left:1.5em;}
a {text-decoration:underline; font-size:100%; overflow:hidden; outline:none; }
img, a img { border: none; text-decoration:none;  }
.clearBoth { clear:both; font-size:1px; height:0; text-align:center; }
iframe { vertical-align: bottom;}
strong { font-weight:bold;}
main { }
img { vertical-align: middle;}



/*---------------------------------------------------------
common
---------------------------------------------------------*/
html {    font-size: 62.5%;}
/* Text elements */
body { font-size:1.6rem; text-align: center;  -webkit-text-size-adjust : 100%; }
body { color:#333; }
h1,h2,h3,h4,h5,h6 { font-size:100%; }
a { color: #666; text-decoration: none; }
a:hover { text-decoration:underline;}
a:hover { opacity: 0.6; filter: alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }

/*pの設定*/
p {text-align:left; line-height:1.48;}
h1+p,h2+p,h3+p,h4+p,h5+p,h6+p { margin-top:30px;}
p+p { margin-top:19px;  line-height:1.7; }/*pが連続していたら、マージン*/
.fa { margin-right:5px; font-size:130%;}/*アイコンフォントの右側のつまりすぎとちょっと小さいのを解消*/


/*---------------------------------------------------------
レイアウト
---------------------------------------------------------*/
/*全体背景*/
#wrapper {}

/*ヘッダー設定*/
.head_logo { position: fixed; top:0; left:0; z-index:98;}



/*キャッチ設定*/
#catch { background-image: url(images/haikei8_02.jpg); background-size: cover;}
body:not(.home)  #catch { height:200px; background-position:left center 30px;}


/*ナビゲーション設定*/

nav {  }/*背景*/
ul#menu-glnv {height:60px; margin-left:auto; justify-content: flex-end; display: flex; align-items: center;}

/*ナビゲーションの文字*/
ul#menu-glnv>li a { color: #000; font-size: 15px;	font-weight: bold; text-decoration:none; }
ul#menu-glnv>li { margin-left:35px;}/*ナビゲーションの文字の間の装飾*/

#menu-glnv > li a:hover {	color: #000; text-decoration:underline;}/*マウスオーバー時*/
.current-menu-item a { }/*ナビゲーションカレントの背景設定*/

/*ナビゲーション　プルダウンの設定*/
li ul.sub-menu { width:280px; }/*プルダウンの幅*/
li ul.sub-menu li a { color: #333 !important; }/*プルダウンの文字の色*/
.sub-menu li { border-top: 1px dashed #E6E6E6; }/*プルダウンのメニュー間の装飾*/
ul#menu-glnv>li:first-child { background:none;}/*ナビゲーションの文字の間の装飾を一番最初は削除している*/
/*ul#menu-glnv>li.current-menu-item a { color: #FF0!important; background:none;}カレントメニューデザイン*/

footer { background-color:#FFF;}

/*ぱんくず設定*/
#pankuzu { background-color: #F8F8F8; padding:10px}


@media screen and (min-width: 320px) and (max-width: 768px) {
nav, .menu__line { background-color:#FFF;}/*背景*/
/*スマホメニューバー*/
.hun_menu  { background:var(--maincolor);}
 ul#menu-glnv>li { margin-left:0;}
 ul#menu-glnv>li a { color: #099 ; }
 ul#menu-glnv {display: block; padding-top:80px;}
 .head_logo { transform: scale(0.8);transform-origin:left top;}
}


/*ページネーション*/
.pagination{   margin:40px 0 50px 0;}
.nav-links{ display: flex; justify-content: center;/*横*/ align-items: center;/*縦*/}
.pagination .page-numbers{   display:inline-block;   margin-right:20px;   padding:10px 15px;   color:#333;   border-radius:3px;   box-shadow:0 1px 1px #999;   background:#fff;}
.pagination .current{   padding:10px 15px;   background:#69a4db;   color:#fff;}
.pagination .prev,.pagination .next{   background:transparent;   box-shadow:none;   color:#69a4db;}
.pagination .dots{   background:transparent;   box-shadow:none;}



ol.syakunh4 li { margin-top:19px;}



.sanbaist01 { background-color: #7393A2; background-size: auto 100%; height: auto; text-align:center; padding:25px 0; color:#FFF; text-align:center; font-weight:bold; margin-bottom:40px; position: relative; width: 100%; font-size:3.4rem;   line-height:1.3; font-family:"Times New Roman","ヒラギノ明朝 Pr6 W6","Hiragino Mincho Pro", "HGS明朝E", "游明朝", "Yu Mincho", "游明朝体", "YuMincho","ＭＳ Ｐ明朝","MS PMincho",Meiryo, serif;   font-weight: 900;}
.sanbaist01:after { content: ' '; height: 0; position: absolute; width: 0; border-style: solid;
border-width: 30px 50px 0 50px;
border-color: #007bff transparent transparent transparent; border-top-color: #7393A2; top: 100%; left: 50%; margin-left: -50px; }

.sanbaist02 { background-color: #E1E9EC; background-size: auto 100%; height: auto; text-align:center; padding:25px 0; color:#333; text-align:center; font-weight:bold; margin-bottom:40px; position: relative; width: 100%; font-size:3.4rem;   line-height:1.3; font-family:"Times New Roman","ヒラギノ明朝 Pr6 W6","Hiragino Mincho Pro", "HGS明朝E", "游明朝", "Yu Mincho", "游明朝体", "YuMincho","ＭＳ Ｐ明朝","MS PMincho",Meiryo, serif;   font-weight: 900;}
.sanbaist02:after { content: ' '; height: 0; position: absolute; width: 0; border-style: solid;
border-width: 30px 50px 0 50px;
border-color: #007bff transparent transparent transparent; border-top-color: #E1E9EC; top: 100%; left: 50%; margin-left: -50px; }



/*レイアウト構成設定*/
main { background-color:#FFF; }
.width { width:1080px; margin-left:auto; margin-right:auto;}
.contents { width:750px; float:left;}
#side_contents { width:220px; float:right;}
@media screen and (max-width: 767px) {
#side_contents { width:100%; float:none;}
}



/*タイトルデザイン*/
.title01 { background:url(images/title_bg.svg) no-repeat center bottom; font-size:3.8rem; color:#002C7D; padding-bottom:50px;}
.title011 {  font-size:3.8rem; color:#002C7D; padding-bottom:30px; margin-top:-40px;}
.title01w { background:url(images/title_bg_white.svg) no-repeat center bottom; font-size:3.8rem; color:#FFF; padding-bottom:50px;}
@media screen and (max-width: 767px) {
	.title01 , .title01w { }
	.type-blog { margin-top:30px;}
	.title011 { margin-top:-30px;}
}



.title02 { position:relative;  padding-bottom:2.0rem;  font-size:2.8rem; margin-bottom:3.0rem; text-align:left; font-family: "Sawarabi Mincho";  font-weight:normal; }
.title02:after {position: absolute;width: 80%;height: 1px;left:0;bottom: 0;border-bottom: 1px solid #808000;content: "";}


.title03 { position:relative;  padding:20px; line-height:1.4; font-size:3.4rem; margin-bottom:30px; text-align:center; font-weight:bold;}
.title03:after {margin-left: -45px;	position: absolute;	width: 90px;	height: 1px;	left: 50%;	bottom: 0;	border-bottom: 2px solid #808000;	content: "";}


.single_title { font-size:30px; text-align:left; margin-bottom:20px;}


.blog_title { background:url(images/title_bg.svg) no-repeat center bottom; font-size:2.8rem; color:#002C7D; padding-bottom:50px;}

div.postbox h3 { background-color:#002C7D; padding:15px; margin-top:40px; color:#FFF; text-align:left; font-size:2.0rem; }
div.postbox h3 span {font-weight:bold !important;}
div.postbox h4 { padding-left:15px; margin-top:30px; text-align:left; font-size:1.8rem; border-left:#002C7D solid 5px; border-bottom:#002C7D solid 1px;}

/*ボタン*/
.btn01 {  display: inline-block;border: solid #333 1px; padding:2.0rem; margin-top:1rem; -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  box-sizing: border-box;  -webkit-transition: all .3s;  transition: all .3s; font-weight: bold;}
.btn01:hover {  background-color: #000; color:#FFF; text-decoration:none; opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha( opacity=100 )"; }


.btn02 {  display: inline-block;border: solid #333 1px; padding:2.0rem; margin-top:1rem; box-sizing: border-box;  transition: all .3s; font-weight: bold; background-color:#FFF;}
.btn02:hover {  background-color: #000; color:#FFF; text-decoration:none; opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha( opacity=100 )"; }

/*.btn02 {background-color:#e6c619; color:#FFF; display:inline-block;  min-width:100px; padding:5px 20px; margin:20px 0; border-radius: 8px;}*/
.btn_order { background-color:#1F7CDB; box-shadow: 5px 5px 0px rgba(17,69,121,0.9); color:#FFF; display:inline-block;  min-width:60%; padding:15px 20px; margin:20px 0; border-radius: 8px; font-weight:bold; font-size:30px;}
.btn_order a {color:#FFF;} 
.yoyaku_btn { color:#FFF; padding:10px 25px; margin-right:20px;}
.yoyaku_btn:hover { opacity: 0.6; filter: alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }
.yoyaku_btn::before {content:'\f0da';	font-family:'Font Awesome 5 Free'	;font-weight:900; margin-right:10px;}




/*申し込み部分の半透明色*/
.order_opacity {background: rgba(131,83,35,.7);}


/*---------------------------------------------------------
記事　single設定
---------------------------------------------------------*/
/*タイトルデザイン*/
h2 { background-color:none;}
.blog_ct { border:#CCC solid 1px; font-size:12px; padding:3px;}



/*---------------------------------------------------------
記事　一覧設定
---------------------------------------------------------*/
ul.itiran_tate li { margin-bottom:20px;}


/*---------------------------------------------------------
サイドバー設定
---------------------------------------------------------*/
#blogside { }
h2.sidetitle { }
#blogside h2.sidetitle { border-bottom:#F0F0F0 solid 1px;} 
#blogside select { padding:10px; border:#CCC solid 1px;  border-radius: 8px;}


/*メニューページ*/
.menu_title  { color:#333333; border-bottom: #CCC solid 1px; font-size:18px; font-weight:bold; padding-bottom:5px; margin-bottom:10px; text-align:left;}
.menu_price { color:#D98898; font-weight:bold; font-size:16px; margin-bottom:10px;}
.menu_img { width:250px; height:150px; object-fit: cover; max-width:none; float:right;}



/*第二階層デザイン*/
.menu_cttitle { font-size:24px; color: #990; text-align:center; border-bottom:#D6D189 solid 2px; margin-bottom:10px; padding-bottom:5px; font-family: "Sorts Mill Goudy", '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', serif; font-weight: 900;}
.widgettitle { color:#bb4f80; border-bottom:#bb4f80 solid 1px; margin-bottom:15px;}
.sidewidget { margin-bottom:30px;}
.sidewidget ul li {margin-bottom:15px; padding-bottom:15px; border-bottom: dashed #ccc 1px;}




/*---------------------------------------------------------
オリジナル追加
---------------------------------------------------------*/
div.wpcf7 p { text-align:center !important;}
div.hiniti2 { text-align:right; margin-top:30px; color:#999; margin-right:55px}



.headslide { position:absolute; top:0; right:0; }

@media screen and (max-width: 767px) {
.headslide { position:absolute; top:0; right:0;  width:100% !important;}
.headslide img { max-width:100%;}

}


ul.about_slide li { background-color:#FFF; color:#FDA424; padding:20px; min-height:230px;}
ul.about_slide li span { font-size:6rem;}
ul.about_slide li p { color:#333;}


@media screen and (max-width: 767px) {
	div.style37_box { margin-top:-50px; margin-left:auto !important; margin-left:0; width:90%;}
}





.slide-items {
  width: 90%; margin:auto;
  height: 100%;
}

.slideprev_btn , .slidenext_btn {position: absolute;	top: 0;	bottom: 0;margin: auto;width: 30px;height: 30px;	background-position: center center;
	background-repeat: no-repeat;
	background-size: 30px auto;
	z-index: 1; cursor:pointer;}

.slideprev_btn {	left: 0;	background-image: url(images/arrow_l.png);}
.slidenext_btn {	right: 0;	background-image: url(images/arrow_r.png)}


/*ul.style67 li:nth-child(3n) { margin-top:60px;}
ul.style67 li:nth-child(3n-1) { margin-top:30px;}*/
.box01 {  display: inline-block; border: solid #FFF 1px; padding:2.0rem; margin-top:1rem; color:#FFF;}


.add-title-0001 { background-image: url(images/photo001.jpg); font-size:6.0rem; padding:70px 0;display: block; background-color:rgba(255,255,255,0.8);
background-blend-mode:lighten;}
.add-title-0001 span { font-size:3.0rem; color:#09C; position: relative; display: block;display: flex;  align-items: center;   justify-content: center; }
.add-title-0001 span:before,.title-0001 span:after {  border-top: 1px solid #09C;  content: "";  width: 4em;}
.add-title-0001 span:before {margin-right: 1em;}.title-0001 span:after { margin-left: 1em; }









.sragmaster { display:inline-block; height: 35px; width:100px; text-align:center;}
.kannrenn_tite { color:#BB4F80; border-bottom:#BB4F80 solid 1px; font-size:20px; padding-bottom:5px; text-align:left;}

.relatelist_url { border-bottom:#CCC dashed 1px; padding-bottom:10px; margin-bottom:10px;}
.relatelist_url a {  color:#BB4F80;}



.info004 {background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #c5e7f5 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 0%,#c5e7f5 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 0%,#c5e7f5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#c5e7f5',GradientType=0 ); /* IE6-9 */
 border:#649B98 solid 1px; padding:15px; margin-top:20px;}
div.info004 h2 {font-family: 'Noto Serif JP', serif; margin-bottom:10px; color:#489299; font-weight:bold;}
div.info004 p { font-size:13px}

.info005 {/background: #ead4be; /* Old browsers */
background: -moz-linear-gradient(top,  #ead4be 0%, #ebdfd7 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ead4be 0%,#ebdfd7 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ead4be 0%,#ebdfd7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ead4be', endColorstr='#ebdfd7',GradientType=0 ); /* IE6-9 */
 border:#E4C9AD solid 1px; padding:15px; margin-top:20px;}
div.info005 h2 {font-family: 'Noto Serif JP', serif; margin-bottom:10px; color:#489299; font-weight:bold;}
div.info005 p { font-size:13px}

.sidetitle { margin-bottom:20px;}




/*addition*/





#toc_container { width:100% !important;} 
.toc_list { text-align:left;}
#toc_container li { margin-bottom:10px;}




	./*slide_bg { background:url(images/slideline.png) repeat-x center }*/


/*additionパソコンのみ*/
@media screen and (min-width: 768px) {
.ani_hover_opacity img {
	opacity: .5;
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.ani_hover_opacity:hover img {
	opacity: 1 !important;}
	
.ani_hover_scale img {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.ani_hover_scale:hover img {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}

}

.balloon2{
  display:block; font-size:2.4rem; font-weight:bold; 
  position: relative;
  margin: 10px; margin-bottom:30px;
  padding:20px;
  background: #3BA2FF;
  border-radius: 0px;
  color: #fff;
}
.balloon2::after{
  content: "";
  position: absolute;
  margin: 0;
  bottom: -25px;
  left: 60px;
  width: 0;
  height: 0;
  border-top: 40px solid #3BA2FF;
  border-left: 22px solid transparent;
  border-right: 12px solid transparent;
  transform: rotate(-30deg);
}

.add--001{ display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center;/*横*/ -webkit-align-items: center; align-items: center;/*縦*/ }
.add--001 span { font-size:12rem; font-weight:900; letter-spacing: -9px; opacity:0.15;}
.add--001>div { margin-left:-60px;}


ul.newslist95 li { margin-bottom:15px; padding-bottom:15px; border-bottom:#CCC solid 1px; text-align:left;} 
ul.newslist95 li span { padding:0.6rem;  border-radius: 0px; display:inline-block; margin-left:20px; width:100px; text-align:center; font-size:1.4rem}


/*会社概要*/
.kaisha {width: 100%;}

.kaisha th,
.kaisha td {
border: 1px solid #ccc;
padding: 20px;
}

.kaisha th {
font-weight: bold;
background-color: #dedede; 
}

@media screen and (max-width: 767px) {
.kaisha,
.kaisha tr,
.kaisha td,
.kaisha th {display:block;}
.kaisha th {width:auto;}
}





ul.add--check01 li { font-size:20px; font-weight:bolder; text-align:left; background-image: url(images/check001.png); background-repeat:no-repeat; background-position:20px center ; padding:20px 20px 20px 80px; margin-top:10px; border-radius:15px;}

ul.add--check02 li { font-size:20px; font-weight:bolder; text-align:left; background-image: url(images/check002.png); background-repeat:no-repeat; background-position:10px center ; padding:20px 20px 10px 60px; border-radius:15px;}
ul.add--check03 li { font-size:20px; font-weight:bolder; text-align:left; background-image: url(images/check003.png); background-color:#FEEBEB; background-repeat:no-repeat; background-position:15px center ; padding:20px 20px 20px 70px; border-radius:0px; margin:20px 0px 0px 0px;}



.style103_odd , .style103_even {display: flex; height:400px; margin-bottom:50px;}
.style103_even {flex-direction: row-reverse;}
.style103_odd>div ,.style103_even>div  { width:60%;display: flex; align-items: center;}
.style103_odd>div:nth-of-type(1) {  margin-right:-5%; }
.style103_even>div:nth-of-type(1) {  margin-left:-5%;}
.style103_even>div:nth-of-type(2) {-webkit-justify-content: flex-end; justify-content: flex-end;}
@media screen and (min-width: 320px) and (max-width: 768px) {
.style103_odd , .style103_even {display: flex; flex-direction: column; height: auto; margin-bottom:5rem;}
.style103_odd>div ,.style103_even>div  { width:100%;display: flex; align-items: center;}
.style103_odd>div:nth-of-type(1)  , .style103_even>div:nth-of-type(1){  margin:0; margin-bottom:-70px; min-height:200px;}
.style103_odd>div:nth-of-type(2)  , .style103_even>div:nth-of-type(2)  { width:90%; margin-left:auto; margin-right:auto;}
#syakun .p60 { padding:15px !important;}
}


.inta01 { font-style:italic; padding-left:50px; background:url(images/inta01.png) no-repeat left 5px; color: #566FA7; text-align:left;}
p.inta02 div { text-align:left;}
p.inta_title { color:#FDA424; font-weight:bold; font-size:2.2rem; border-bottom:#FC3 solid 1px; margin-top:50px;}
p.presi { font-size:3.6rem; font-weight:bold;   font-family: "Sawarabi Mincho"; text-align:center;}

p.syakunh4 { font-size:2rem; font-weight:bold; margin-top:20px;}
#syakun h3 { margin-bottom:30px;}
#syakun h4 { margin-bottom:20px; margin-top:30px; font-size:2rem;}



.waku { position:relative}
.movieslider  { position:relative; z-index:1}
.saiseibtn { position:absolute; z-index:2;    top: 50%;    left: 50%;    transform: translate(-50%, -50%);    -webkit-transform: translate(-50%, -50%);    -ms-transform: translate(-50%, -50%); opacity:0.9; cursor:pointer;}
.saiseibtn:hover { opacity:1;}	

.sample-img {  cursor: pointer;  max-width: 550px;  overflow: hidden;  width: 100%;}
.sample-img img {  height: auto;  transition: transform .6s ease;/* ゆっくり変化させる */  width: 100%;}
.sample-img:hover img {  transform: scale(1.1);/* 拡大 */}

	
/*モーダルを開くボタン*/

/*モーダル本体の指定 + モーダル外側の背景の指定*/
.modal-container , .modal-container2{	position: fixed; z-index:100;	top: 0;	left: 0;	width: 100%;	height: 100%;	text-align: center;	background: rgba(0,0,0,80%);	padding: 40px 20px;	overflow: auto;	opacity: 0;	visibility: hidden;	transition: .3s;  box-sizing: border-box;}
/*モーダル本体の擬似要素の指定*/
.modal-container:before , .modal-container2:before{	content: "";	display: inline-block;	vertical-align: middle;	height: 100%;}
/*モーダル本体に「active」クラス付与した時のスタイル*/
.modal-container.active , .modal-container2.active{	opacity: 1;	visibility: visible;}
/*モーダル枠の指定*/
.modal-body , .modal-body2{ 	position: relative;	display: inline-block;	vertical-align: middle;	width: 800px; height:450px;}
/*モーダルを閉じるボタンの指定*/
.modal-close , .modal-close2{	position: absolute;	display: flex;  align-items: center;  justify-content: center;	top: -40px;	right: -40px;	width: 40px;	height: 40px;	font-size: 40px;	color: #fff;	cursor: pointer;}
/*モーダル内のコンテンツの指定*/
.modal-content , .modal-content2{	background: #fff;	text-align: left;}


.t_design02 { table-layout: auto; margin-right:auto; margin-left:auto;}
.t_design02 p { margin:0 !important;}
.t_design02 th { padding:20px 15px; text-align: left; vertical-align: top; font-weight:bold; white-space:nowrap; background-color:#EFEFEF; text-align:left; }
.t_design02 td { padding:12px 15px;  width: 80%; text-align:left;}


@media screen and (min-width: 320px) and (max-width: 768px) {
.modal-container , .modal-container2 {padding: 0;}
.modal-body , .modal-body2{ position: absolute; top:40px; left:0; 	width: 100%; height: auto;}
.modal-close , .modal-close2{right: 0px;}
.modal-container:before , .modal-container:before2{	content: "";	display: block;	vertical-align: top;	height: 100%;}
.slick-slide img { width:200px !important;}
}



.cus-row { display: grid; grid-template-columns: 1fr 1fr; margin-bottom:50px;}
.cus-row>div:nth-child(1) { }
.cus-row>div:nth-child(2) { margin-top:150px; margin-left:-100px; padding:2rem; background-color:rgba( 0, 0, 0, 0.7 );width:calc(var(--width) / 2); } 
.cus-row:nth-child(even) { transform: scaleX(-1);}
.cus-row:nth-child(even)>div {transform: scaleX(-1);}
@media screen and (max-width: 768px){
.cus-row { display: block; } 
.cus-row>div:nth-child(1){ height:300px; width:100%;}
.cus-row>div:nth-child(2) { width:90%; margin-top:-80px; margin-left:0;}
}

/*新規セット*/
/* wrap */
.hero {  position: relative; margin-top:0px;}
/* video */
.video-box {  position: relative;  overflow: hidden;  width: 100%;  height: 100vh;}
.video {  position: absolute;  top: 50%;  left: 50%;  min-width: 100%;  min-height: 100%; transform: translate(-50%, -50%);}
/* overlay */
.overlay::after {  position: absolute;  top: 0;  left: 0;  display: block;  width: 100%;  height: 100%;  content: "";  background: rgba(0, 0, 0, 0.4);}

/* text */
.text-box {  position: absolute; bottom:100px;  left: 20px; }
.toptim { position:absolute; top:0px; right:0px;}
.bg003 { background-image:url(images/bg003.png); background-position:center top; background-repeat:no-repeat; background-size: 100% 100%; width:100%;  height:160px; position: absolute; bottom:0;  z-index:10;}
@media screen and (max-width: 768px){
	.hero { margin-top:0px; }
	.bg003 { height:60px;  bottom:20px;  }
	.douganoushiro { margin-top:-20px; position:relative; z-index:50}
	.text-box {bottom:30px;  left: 0px; }
	.video {  position: absolute;  top: 45%;  left: 50%;  min-width: 100%;  min-height: 100%; transform: translate(-50%, -50%);}
	#wrapper { position:relative; padding-top: 50px;}
}











/*エントリーット*/
.section_entory { background-color: #40629D; position:relative;
  max-width: 100%;
  margin: 0 auto;
  padding: 30px 0;
	overflow: hidden;
}
.sliderArea {  overflow: hidden;}
.sliderWide {  max-width: 100%;  margin: 0 auto;  padding: 0px 0;}
.slick-arrow { display:none !important;}

.slider {  max-width: 280px;  margin: 0 auto;  padding: 0;}
.slider .slick-list {  overflow: visible;}
.slider .slick-track {}
.slider .slick-slide {  padding: 0 10px;}
.slider .slick-slide.slick-current {  opacity: 1;}
.slider .slick-slide a {  display: block;}
.slider .slick-slide a:hover {  display: block;}
.slider img {  height: auto;  width: 100%;}

.slick-dots {  bottom: -33px;}

.entory001 { position:absolute; z-index:20;top: 0; left: 50%; transform: translateX(-50%);}
.entory002 { position:absolute; z-index:20;top: 30px; left: 50%; transform: translateX(-50%);}
.entory002::after {
position: absolute; top:120px; z-index:40;
left: 0;
content: '';
width: 100%;
height: 5px;
background: #FFF;
bottom: 20px; /*アンダーラインが現れ始める位置（aタグの下辺からの高さ）*/
opacity: 0;
visibility: hidden;
transition: 0.5s;
}
.entory002:hover::after {transition: 0.5s;
visibility: visible;
bottom: 12px; /*アニメーションが止まる位置*/
opacity: 1;
}
@media screen and (min-width: 320px) and (max-width: 768px) {
.slider { position:relative; top:200px;}
.slick-slide { height:300px !important; width:150px !important; overflow:hidden;}
.entory002 { width:96%; height:auto;}
.entory002::after {bottom: 30px;}
.entory002:hover::after {transition: 1.5s;
visibility: visible;
bottom: 22px; /*アニメーションが止まる位置*/
opacity: 0;
}
}




/*画像アコーディオン*/
.cp_accordionslide03 {	display: flex;	visibility: hidden;	width: 100%;	height: 60vh;}
.cp_accordionslide03 .slideitem {	position: relative;	visibility: visible;	overflow: hidden;	width: 50%;
	height: 100%;	cursor: pointer;		transition: all 0.3s linear 0s;	background-repeat: no-repeat;	background-position: center center;	background-size: cover;}
.cp_accordionslide03 .slideitem:nth-child(1) {
	background-image: url('/images/menu001.png');
}
.cp_accordionslide03 .slideitem:nth-child(2) {
	background-image: url('/images/menu002.png');
}
.cp_accordionslide03 .slideitem:nth-child(3) {
	background-image: url('/images/menu003.png');
}
.cp_accordionslide03 .slideitem:nth-child(4) {
	background-image: url('images/111.jpg');
}
.cp_accordionslide03 .slideitem:nth-child(5) {
	background-image: url('images/111.jpg');
}
.cp_accordionslide03 .slideitem:after {	position: absolute;	z-index: 2;	top: 0;	left: 0;	display: block;	width: 100%;	height: 100%;	content: '';	opacity: 0;	background-color: rgba(57,73,171 ,0.6);}
.cp_accordionslide03:hover .slideitem:hover {	width: 60%;}
.cp_accordionslide03:hover .slideitem:not(:hover):after {	transition: all 0.2s linear 0s;	opacity: 1;}
.cp_accordionslide03 .slideitem .slidecont {
	position: absolute;
	z-index: 4;
	bottom: 60px;
	left: -60px;
	visibility: hidden;
	max-width: 400px;
	padding: 20px;
	color: #ffffff;
	border-radius: 5px;
	background-color: rgba(26,35,126 ,0.6);
}
.cp_accordionslide03 .slideitem .slidecont p {
	font-size: 1.4em;
}
.cp_accordionslide03:hover .slideitem:hover .slidecont {
	left: 30px;
	visibility: visible;
	transition: all 0.3s cubic-bezier(0, 0, 0, 1.82) 0.5s;
	opacity: 1;
}
@media only screen and (max-width:768px) {
	.cp_accordionslide03 {		height: 80vh;	}
	.cp_accordionslide03 .slideitem .slidecont h2 {		font-size: 0.9em;	}
	.cp_accordionslide03 .slideitem .slidecont p {		font-size: 0.7em;	}
	.cp_accordionslide03 .slideitem .slidecont {		right: 10px;		bottom: 10px;		left: 10px;	}
	.cp_accordionslide03:hover .slideitem:hover .slidecont {		left: 10px;	}
}


div.style643 {}
div.style643>div { background-repeat:no-repeat; background-size: cover;background-position: -30vw top; }
div.style643_box001 { width:500px; position:relative; left:50%; padding:100px 50px; text-align:left;}
div.style643_box001>span { display:inline-block; padding:20px; }


@media only screen and (max-width:768px) {
div.style643>div { height:300px; background-position: -0vw top;}
div.style643_box001 { width:96%; left:-20px;  padding:30px 0px 0px 0px; transform: scale(0.8); }
.sppp { background-position:-100px top !important}
.sptoppp { margin-top:150px !important}
}


.reverse { transform: scaleX(-1);}
.reverse000:nth-child(even)>div {transform: scaleX(-1);}




/* 第二階層タイトルアニメーション */
.mask-title {color: transparent; display: inline-block;  overflow: hidden;  position: relative;  transition: color 0ms 500ms;  z-index: auto; padding:10px 30px;  transform: skewX(-7deg);}
.mask-title::after {  background: #FFF; bottom: 0;  content: '';  display: block;  left: 0;  position: absolute;  right: 0;  top: 0;  transform: translate(0, 100%) ;  z-index: -1; }
.mask-title.is-animated_title {  color: #333;}
.mask-title_blue.is-animated_title {  color: #006699;}
.mask-title.is-animated_title::after {  animation: mask-bg_title 0.2s forwards ;}
@keyframes mask-bg_title {
  0% {    transform: translate(0, 100%) ;  }
  100% {    transform: translate(0, 0%) ;  }
}

.mask-title_ye { font-size:30px; color: transparent; display: block;  overflow: hidden;  position: relative;  transition: color 0ms 500ms;  z-index: auto; padding:5px 5px;  transform: skewX(0deg); width:500px; margin-left:auto; margin-right:auto; font-weight:bold;}
.mask-title_ye::after {  background: #FFFF99; bottom: 0;  content: '';  display: block;  left: 0;  position: absolute;  right: 0;  top: 0;  transform: translate(0, 100%) ;  z-index: -1; }
.mask-title_ye.is-animated_title {  color: #3F5F9D;}
.mask-title_ye.is-animated_title::after {  animation: mask-bg_title 0.2s forwards ;}
@keyframes mask-bg_title {
  0% {    transform: translate(0, 100%) ;  }
  100% {    transform: translate(0, 0%) ;  }
}

/* ズームインアニメーション */
.anim-box { text-align:center; opacity: 0;}
.anim-box.zoomin.is-animated_zooom {  animation: zoomIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) forwards;}
 @keyframes zoomIn {
  0% {
    transform: scale(0.3);
    opacity: 0;
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@media only screen and (max-width:768px) {
.mask-title_ye { width:96%;}
}



/* フォトギャラリーアニメーション */
.sample7 { 	width:			1000px; margin:0 auto;	height:			 auto;	overflow:		hidden;	position:		relative;}
img.photobg { width:100%;}
.sample7 .caption { padding-top:120px;	color:			#fff;	text-align: 		center;}
.sample7 .mask {	width:			100%;	height:			100%;	position:		absolute;	top:			0;	left:			0;	opacity:		0;	/* 表示させない */	background-color:	rgba(0,45,125,0.6);	transform:		rotateX(-180deg);	transition:		all 0.6s ease;}
.sample7:hover .mask {
	transform:		rotateX(0deg);
	opacity:		1;	/* ホバーで表示する */
}



/* フォトギャラリータイトルアニメーション */
.effect { opacity : 0;    transform: translateX(50px);  transition : all 1s}
.is-active  {    opacity: 1;    transform: translate(0px, 0px);}


/* ブログスタイル */
ul.blogstyle003 {display: flex; column-gap: 3.3%;}
ul.blogstyle003 li { background-color:#FFF; text-align:left; position:relative;}
ul.blogstyle003 li img { width:100% !important;}
ul.blogstyle003 li a:hover {opacity: 1.0; text-decoration:none;}
ul.blogstyle003 li a:hover:before {position: absolute;content: '';width: 100%;height: 100%;left: 0;top: 0;background-color: rgba(0,102,153,.2);z-index: 1;}
ul.blogstyle003 li .bloglist_title { color:var(--maincolor); font-size:1.8rem; text-align:left !important; font-weight:bold; margin-top:10px;}
ul.blogstyle003 li .hiniti {color: var(--maincolor); display: flex;align-items: center;  justify-content: left; }
ul.blogstyle003 li .hiniti::before {  content: '';  display: block;  width: 30px;  height: 3px;  background:  var(--maincolor);margin-right: 10px;}
@media only screen and (max-width:768px) {
ul.blogstyle003 {display: block;}
ul.blogstyle003 li a { display:grid; grid-template-columns:  1fr 100px; }
ul.blogstyle003 li .blog_box_a {order: 2 }
}



.box02{
    padding: 0.5em 1em;
    margin: 2em 0;
    color: #5d627b;
    background: white;
    border-top: solid 5px #5d627b;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
}







/*ブログ・インタビュー*/
.scroll-section {
  position: relative;
  background: #fafafa;
  overflow: hidden; background:url(/images/amiami.png);
}

.bi_textani {
	position: absolute;
	opacity: 0;
	text-align: right;
	left: -89px;
}

.bi_textani {
	width:100vw;
	z-index:10;
	top: -64px; /*最初は画面の下に置く（150%ぐらい下） */
	font-weight: bold;
	transform: translateY(0);
	transition: all 0.5s ease-out;
}




.text_activ {  top: 0%;opacity: 1;}

.bi_textani2{ background-color: #FFF; width:100vw; z-index:10;
  top: 150%; /* 最初は画面の下に置く（150%ぐらい下） */
  font-size: 48px;
  font-weight: bold;
  transform: translateY(0);
  transition: all 0.5s ease-out;
}

.right-image_list { width:1000px; margin-left:auto; margin-right:auto;}

.intarv { position:relative;   z-index:20; display: grid ; column-gap: 3.3%; grid-template-columns: 50% 50%; width:900px; margin-top:100px;}

ul.intarv li:nth-child(even) { margin-top:100px;}
ul.intarv li { text-align:left; font-weight: bold}
ul.intarv li p { margin:0; margin-top:10px;}
ul.intarv li img { width:100%;}

.right-image_list img {  width: 400px;}


.spacer5 {  position: relative;
  height: 150vh; /* セクション自体を長めにしておく */
  background: #F93;
  overflow: hidden;
}


.hanyon { opacity: 0 !important;}





.bi_textani.visible {
  opacity: 1;
}


.bi_textani.fixed {  position: fixed;  top: 20px;}

.bi_textani.absolute {  position: absolute;}


.bi_textani2 {
  opacity: 0;  text-align: right;
  position: absolute;
  transition: opacity 0.5s, top 0.5s;
  /* 必要ならここにスタイル追加 */
}

.bi_textani2.visible {  opacity: 1!important;}

.bi_textani2.fixed {
  position: fixed;
  top: 20px;
}

.bi_textani2.absolute {
  position: absolute;
}

.scroll-section2 { padding-top:200px;}

ul.blog_list_dtio {display: grid ; column-gap: 2.3%; grid-template-columns: 1fr 1fr 1fr; width:90%; margin-left:auto; margin-right:auto; padding:0}
ul.blog_list_dtio li { margin-bottom:40px; text-align:left; font-weight: bold}
ul.blog_list_dtio li p { margin:0; margin-top:10px;}
ul.blog_list_dtio li img { width:100%;}




.fade_img {
  width: calc((100% - 40px) / 3); /* 3列用の幅調整 */
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.fade-in {
  opacity: 1;
  transform: translateY(0);
}

.hover_box img{ transition:1s all;}
.hover_box img:hover{  transform:scale(1.2,1.2);}

@media only screen and (max-width:768px) {
.bi_textani.fixed {  position: fixed;  top: 40px !important; width:100%;}
.bi_textani2.fixed {  position: fixed;  top: 40px !important;}

.intarv { position:relative;   z-index:20; display: block ; column-gap: 3.3%; grid-template-columns: 50% 50%; width:100%; margin-top:100px; }

ul.intarv li:nth-child(even) { margin-top:0px;}
ul.intarv li { text-align:left; font-weight: bold;margin-top:0px;}
ul.intarv li  { padding-top:150px;}
ul.intarv li p { margin:0; margin-top:10px; width:96%; margin-left:auto; margin-right:auto;}
ul.intarv li img { width:100%;}
.right-image_list { width:100%; margin-left:auto; margin-right:auto;}
.right-image_list img {  width: 100%;}



ul.blog_list_dtio {display: block; width:90%; margin-left:auto; margin-right:auto; padding:0}
ul.blog_list_dtio li a { display: grid ;column-gap: 2.3%; grid-template-columns: 120px 100%; margin-bottom:40px; text-align:left; font-weight: bold}
ul.blog_list_dtio li p { margin:0; margin-top:0px;}
ul.blog_list_dtio li img { width:100%;}
}