/*
Theme Name: 株式会社ワタル テーマver1.0
Theme URI: https://wataru-s.co.jp
Author:  Open Source Inc.
Author URI: https://www.open-source.co.jp
Description: シンプルウェブページサービス
Version: 1.0
License: 
License URI: 
Tags: 
Text Domain: https://wataru-s.co.jp
*/

@charset "UTF-8";

/*Googleフォント*/
@import url(https://fonts.googleapis.com/css2?family=Manrope:wght@300;400&Noto+Sans+JP:wght@300;400;500;700&Noto+Serif+JP&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap);
/*font-family: 'Noto Sans JP', sans-serif; 基本の日本語「Noto Sans JP」*/
/*font-family: 'Noto Serif JP', serif;　明朝*/
/*font-family: 'Manrope', sans-serif;　TELや数字用のゴシック*/
/*font-family: "Poppins", sans-serif;　英語のキャッチコピーやサブタイトル*/

/*サイズやバランスを欧文フォントにあわせた日本語フォント*/
/*https://github.com/ookamiinc/kinto*/
/*「font」ディレクトリに設置して参照*/

/*google Material Symbols*/
@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200");

/*Adobeフォント*/
/*myriad-variable*/
/*@import url("https://use.typekit.net/anr1sks.css");　←読み込みしてないのに表示される…なぜ*/
/*font-family: "myriad-variable", sans-serif;　ウェイトは70、300*/

/*秀英丸ゴシック*/
/*読み込みはmain.jsに記載*/
/*font-family: "dnp-shuei-mgothic-std", sans-serif;　ウェイトは400、600*/


/*
テーマカラーメモ

ポイントカラーカラー、文字色、ボタンの色（hoverは0.8に）
color: color(display-p3 0.29 0.573 0.824)

サブカラー

ベタ背景色：グラデ（トップ）
background-image: linear-gradient(90deg, #00a9ea, #006dbc);

ベタ背景色：濃いグレー（フッター）
#333333

*/
.a{
	color: color(display-p3 0.29 0.573 0.824)
}



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, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	
	box-sizing: border-box;/*width:100%で､padding分をハミ出させないためのスタイル*/
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-ms-box-sizing: border-box;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, nav, section { display: block; }

audio, canvas, video {
	display: inline-block;
	max-width: 100%;
}

html {
	font-family: sans-serif;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:	 100%;
	font-size: 62.5%;
	
	
}


body {
	position:relative;
	margin:0;
	padding:0;
	font-size: 1.7rem;
	line-height: 1.8;
	font-family: 'Noto Sans JP',YakuHanJP,"Kinto Sans","Helvetica Neue","Segoe UI",Helvetica,"游ゴシック体",YuGothic,"Yu Gothic M","游ゴシック Medium","Yu Gothic Medium","メイリオ",Meiryo,sans-serif;
	color : #333333;
	margin-top: 0px;
	font-weight: normal;
	overflow: hidden;
	/*border-left: solid 5px #0D468F;*/
	
}


body:before,
body:after {
	content:"";
	display: block;
	position: absolute;
	top:0;
	bottom: 0;
	width: 60px;
	
	background-color: #ffffff;
	z-index: 1;
	pointer-events: none;
}

body.frontpage:before,
body.frontpage:after {
	background-color: transparent;
}

body:before{
	left: 0px;
	border-right: solid 1px #636363;
}

body:after{
	right: 0px;
	border-left: solid 1px #636363;
}

.clearfix:after,
.pc_only_clearfix:after {
	content: ".";
	display: block;
	height: 0.1px;
	line-height: 0;
	clear: both;
	visibility: hidden;
}

/* ----------Hides from IE-mac \*/
* html .clearfix,
* html .pc_only_clearfix {
	height: 1%;
}

.clearfix,
.pc_only_clearfix {
	display: block;
}

/* ----------for IE 5.5-7---------- */
.clearfix,
.pc_only_clearfix {
	zoom: 100%;
}

/*Chromeでbuttonなどをクリックした際の青枠線を表示しない*/
*:focus {
	outline: none;
}

a {
	color : #333333;
	text-decoration:none;
	outline : 0 ; /* text-indentを使用した際にFirefoxでリンク線が出ないようにする */
}
a:visited{ color:#3e3e3e;}
a:focus { outline: thin dotted; }
a:hover, a:active {
	text-decoration  : none; /*下線指定*/
	
}

h1, h2, h3, h4, h5, h6 {
	clear: both;
	margin:0;
}

address {
	font-style: italic;
	margin-bottom: 24px;
}

abbr[title] { cursor: help; }

b, strong { font-weight: 600; }

cite, dfn, em, i { font-style: italic; }

mark, ins { text-decoration: none; }

p { text-align:left;
	color:#333333;
}

code, kbd, tt, var, samp, pre {
	font-family: monospace, serif;
	font-size: 15px;
	-webkit-hyphens: none;
	-moz-hyphens:	none;
	-ms-hyphens:	 none;
	hyphens:		 none;
	line-height: 1.6;
}

pre {
	border:none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing:	border-box;
	box-sizing:		 border-box;
	margin-bottom: 24px;
	max-width: 100%;
	overflow: auto;
	padding: 12px;
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;
}

blockquote,
q {
	-webkit-hyphens: none;
	-moz-hyphens:	none;
	-ms-hyphens:	 none;
	hyphens:		 none;
	quotes: none;
}

blockquote:before, blockquote:after, q:before,q:after {
	content: "";
	content: none;
}

blockquote {
	font-size:100%;
	font-style: italic;
	font-weight: 300;
	line-height: 1.6;
}

blockquote cite, blockquote small {
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
}

blockquote em, blockquote i, blockquote cite { font-style: normal; }

blockquote strong,
blockquote b { font-weight: 400; }

small { font-size: smaller; }

big { font-size: 125%; }

sup, sub {
	font-size: 75%;
	height: 0;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup { bottom: 1ex; }

sub { top: .5ex; }

ul{ list-style-type:none; }
ol{
	list-style-type:none;
	margin-left:1.5em;
	text-indent:-1.5em;
	}

li > ul,
li > ol { margin: 0 0 0 0px; }

img {
	-ms-interpolation-mode: bicubic;
	border: 0;
	vertical-align: middle;
	
	/*image-rendering: -webkit-optimize-contrast;*/
}

a:hover img{
	filter:alpha(opacity=80); /*IE*/
	-moz-opacity:0.80; /*FF*/
	opacity:0.80;
}

figure { margin: 0; }

fieldset {
	border: 1px solid #dadada;
	margin: 0 0 24px;
	padding: 11px 12px 0;
}

legend { white-space: normal; }

button, input, select, textarea {
	-webkit-box-sizing: border-box;
	-moz-box-sizing:	border-box;
	box-sizing:		 border-box;
}

button, input { line-height: normal; }

 /* Removing the inner shadow, rounded corners on iOS inputs */
input, textarea {background-image: -webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0)); }

button, html input[type="button"], input[type="reset"], input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled], input[disabled] { cursor: default; }

input[type="checkbox"],
input[type="radio"] { padding: 0; }

input[type="search"] {
	-webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
	vertical-align: top;
}

table, th, td { border:none; }

table {
	font-size:100%;
	border-collapse:collapse;
	}

caption, th, td {
	font-size:100%;
	line-height:1.6;
	font-weight: normal;
}



/* -------------------- 

ローディング

-------------------- */

/*ローディング　画面全体*/
.loading_box{
	display: none;
}


/*ローディング　画面全体*/
/*
.loading_box{
	position: fixed;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 100vh;
	width: 100vw;
	top:0;
	bottom: 0;
	left: 0;
	right: 0;
	background: url(../img/logo_color.svg) no-repeat center 42%;
	background-size: 180px 55px;
	background-color: #ffffff;
	z-index: 20000 !important;
}


.sk-fading-circle {
	margin: 100px auto;
	width: 40px;
	height: 40px;
	position: relative;
}

.sk-fading-circle .sk-circle {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

.sk-fading-circle .sk-circle:before {
	content: '';
	display: block;
	margin: 0 auto;
	width: 15%;
	height: 15%;
	background-color: #333;
	border-radius: 100%;
	-webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
			animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
}
.sk-fading-circle .sk-circle2 {
	-webkit-transform: rotate(30deg);
		-ms-transform: rotate(30deg);
			transform: rotate(30deg);
}
.sk-fading-circle .sk-circle3 {
	-webkit-transform: rotate(60deg);
		-ms-transform: rotate(60deg);
			transform: rotate(60deg);
}
.sk-fading-circle .sk-circle4 {
	-webkit-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
			transform: rotate(90deg);
}
.sk-fading-circle .sk-circle5 {
	-webkit-transform: rotate(120deg);
		-ms-transform: rotate(120deg);
			transform: rotate(120deg);
}
.sk-fading-circle .sk-circle6 {
	-webkit-transform: rotate(150deg);
		-ms-transform: rotate(150deg);
			transform: rotate(150deg);
}
.sk-fading-circle .sk-circle7 {
	-webkit-transform: rotate(180deg);
		-ms-transform: rotate(180deg);
			transform: rotate(180deg);
}
.sk-fading-circle .sk-circle8 {
	-webkit-transform: rotate(210deg);
		-ms-transform: rotate(210deg);
			transform: rotate(210deg);
}
.sk-fading-circle .sk-circle9 {
	-webkit-transform: rotate(240deg);
		-ms-transform: rotate(240deg);
			transform: rotate(240deg);
}
.sk-fading-circle .sk-circle10 {
	-webkit-transform: rotate(270deg);
		-ms-transform: rotate(270deg);
			transform: rotate(270deg);
}
.sk-fading-circle .sk-circle11 {
	-webkit-transform: rotate(300deg);
		-ms-transform: rotate(300deg);
			transform: rotate(300deg); 
}
.sk-fading-circle .sk-circle12 {
	-webkit-transform: rotate(330deg);
		-ms-transform: rotate(330deg);
			transform: rotate(330deg); 
}
.sk-fading-circle .sk-circle2:before {
	-webkit-animation-delay: -1.1s;
			animation-delay: -1.1s; 
}
.sk-fading-circle .sk-circle3:before {
	-webkit-animation-delay: -1s;
			animation-delay: -1s; 
}
.sk-fading-circle .sk-circle4:before {
	-webkit-animation-delay: -0.9s;
			animation-delay: -0.9s; 
}
.sk-fading-circle .sk-circle5:before {
	-webkit-animation-delay: -0.8s;
			animation-delay: -0.8s; 
}
.sk-fading-circle .sk-circle6:before {
	-webkit-animation-delay: -0.7s;
			animation-delay: -0.7s; 
}
.sk-fading-circle .sk-circle7:before {
	-webkit-animation-delay: -0.6s;
			animation-delay: -0.6s; 
}
.sk-fading-circle .sk-circle8:before {
	-webkit-animation-delay: -0.5s;
			animation-delay: -0.5s; 
}
.sk-fading-circle .sk-circle9:before {
	-webkit-animation-delay: -0.4s;
			animation-delay: -0.4s;
}
.sk-fading-circle .sk-circle10:before {
	-webkit-animation-delay: -0.3s;
			animation-delay: -0.3s;
}
.sk-fading-circle .sk-circle11:before {
	-webkit-animation-delay: -0.2s;
			animation-delay: -0.2s;
}
.sk-fading-circle .sk-circle12:before {
	-webkit-animation-delay: -0.1s;
			animation-delay: -0.1s;
}

@-webkit-keyframes sk-circleFadeDelay {
	0%, 39%, 100% { opacity: 0; }
	40% { opacity: 1; }
}

@keyframes sk-circleFadeDelay {
	0%, 39%, 100% { opacity: 0; }
	40% { opacity: 1; } 
}
*/



/* -------------------------------- 

 レイアウト設定
 
-------------------------------- */

/*大枠の構成
	#top　ページトップアンカー
	.header　ヘッダー
	.drawermenu　グランドメニュー
	.contents_all　コンテンツ
	.footer　フッター
	.topicpath_area　パンくず
*/

/* --------------------

ページトップアンカー

-------------------- */

#top{
	
}


/* --------------------

ヘッダー

-------------------- */

/*div*/

.header{
	display: block;
	position: fixed;
	width: 100%;
	height: 80px;
	/*min-width: 1120px;*/
	margin: 0 auto;
	text-align: right;
	background-color: #ffffff;
	border-bottom: solid 1px #636363;
	z-index: 9999;
}

/*トップページのみ*/
.frontpage .header {
}

.header_inner{
	display: block;
	position: relative;
	width: 100%;
	/*max-width: 1240px;*/
	margin: 0 auto;
	height: 80px;
	padding-left: 0px;
	padding-right: 0px;
	text-align: right;
}

/*ドロワーメニューが開いた時（bodyに「drawer-open」が付く）*/
.drawer-open .header_inner{

}

/*固定ヘッダーロゴ　div*/
.btn_logo{
	display: block;
	position: absolute;
	top:0px;
	left:60px;
	width: 236px;
	height: 80px;
	
	z-index: 10003;/*グランドメニューは10004; headerは10002*/
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.btn_logo a,
.frontpage .btn_logo p{
	display: block;
	position: relative;
	width: 236px;
	height: 80px;
	background: url(../img/logo_horizontal.svg) no-repeat center center;
	background-size: 236px 40px;
}

.frontpage .btn_logo p{
	background: url(../img/logo_horizontal.svg) no-repeat center center;
	background-size: 236px 40px;
}

.frontpage .btn_logo p a{
	display: none;
}

.btn_logo p span{
	display: none;
}


/*ヘッダーメインメニュー　div（PCのみ表示）*/
.header_menu{
	display: inline-block;
	position: absolute;
	height: 80px;
	top: 0px;
	right: 0px;
	
	text-align: center;
	white-space: nowrap;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

/*画面幅1080未満*/
@media (max-width: 1080px) {
	.header_menu{
		right: 0px;
	}
}

.header_menu ul{
	display: flex;
}

.header_menu ul li{
	display: flex; /* 子要素をflexboxで揃える */
	flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
	justify-content: center; /* 子要素をflexboxにより中央に配置する */
	align-items: center;  /* 子要素をflexboxにより中央に配置する */
	position: relative;
	vertical-align: middle;
	height: 80px;
	margin-left: 0px;
	margin-right: 0px;
	white-space: nowrap;
	line-height: 100%;
	padding: 0px 0px 0px 0px;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.header_menu ul li.header_tel{
	margin-left: 0px;
	margin-right: 0px;
	height: 80px;
}



.header_menu ul li a{
	display: flex; /* 子要素をflexboxで揃える */
	justify-content: center; /* 子要素をflexboxにより中央に配置する */
	align-items: center;  /* 子要素をflexboxにより中央に配置する */
	height: 100%;
	padding: 14px 2vw 14px 2vw;
	color: #333333;
	font-size: 1.6rem;
	font-weight: 400;
	border-left: solid 1px #636363;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}



/*画面幅1080px以上*/
@media (max-width: 1080px) {
	.header_menu ul li a{
		padding: 11px 15px 11px 15px;
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
}


.frontpage .header_menu ul li a{
}

.header_menu ul li a:hover,
.header_menu ul li a:hover span{
	text-decoration: none;
	color: color(display-p3 0.29 0.573 0.824) !important;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.header_tel a {
	display: flex;
	height: 94px;
	font-family: 'Manrope', sans-serif;
	color: #ffffff !important;
	font-size: 2.6rem !important;
	font-weight: 600 !important;
	background-color: color(display-p3 0.29 0.573 0.824);
	align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
	pointer-events: none;
}

/*
.header_menu ul li.header_tel  a:hover{
	color: #ffffff !important;
	opacity: 0.8;
}

.header_menu ul li.header_tel a:hover span{
	color: #ffffff !important;
}
*/

.header_tel a span{
	font-size: 1.5rem;
	font-weight: 600;
	margin-right: 0.5rem;
}



/* --------------------

グランドメニュー（ドロワーメニュー）

-------------------- */

.drawermenu{
}

/*ドロワー全体　nav　※背景色以外のstyleは「drawer.css」に記載*/
.drawer-nav {
	background-color: rgba(255,255,255, 0.95);
}

/*グランドメニュー全体　div*/
.drawermenu_box {
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center; /* 縦方向中央揃え */
	-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
	justify-content: center; /* 横方向中央揃え */
	margin: 0 auto;
	padding: 8vh 0px 50px 0px;
	width: 300px;
}

.drawermenu.scroll_change .drawermenu_box {
}

.drawermenu_outer{
	display: inline-block;
	position: relative;
	text-align: center;
	letter-spacing: -.40em;
	padding: 0% 30px 30px 30px;
	margin: 0 auto;
	max-width: 960px;
	
	/*
	-webkit-filter: drop-shadow(0px 3px 8px rgba(0,0,0,.05));
	filter: drop-shadow(0px 0px 8px rgba(0,0,0,.05));
	*/
}

.drawermenu_inner{
	display: block;
	position: relative;
	text-align: center;
}


/*画面幅1200px以上*/
@media (min-width: 1200px) {
	.drawermenu_outer{
	}
	.drawermenu_inner{
	}
}


.drawermenu_logo{
	display: block;
	position: relative;
	vertical-align: middle;
	letter-spacing: normal;
	width: 100%;
	margin-bottom: 40px;
}

.drawermenu_logo a{
	display: block;
	position: relative;
	width: 140px;
	height: 94px;
	background: url(../img/logo.svg) no-repeat center center;
	background-size: 140px 100px;
}

.drawermenu_logo a span{
	display: none;
}

.drawermenu_1list_box {
}

.drawermenu_1list_box ul {
}

.drawermenu_1list_box ul li{
	width: 100%;
	padding: 0px 0px 0px 0px;
	margin-bottom: 0px;
	background: none;
}

.drawermenu_1list_box ul li a{
	font-size: 1.6rem;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}


.drawermenu_1list_box li a:hover,
.drawermenu_1list_box li a:hover span{
	color: rgb(0, 174, 175, 1) !important;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}


/*div*/
.drawermenu_1list_box{
	display: inline-block;
	position: relative;
	vertical-align: top;
	letter-spacing: normal;
	text-align: left;
}

.drawermenu_1list_box ul{
	display: block;
	position: relative;
	overflow: hidden;
}

.drawermenu_1list_box ul.drawermenu_list > li,
.drawermenu_1list_box.drawermenu ul.drawermenu_list > li {
	display: block;
	position: relative;
	margin-bottom: 1.5rem;
	white-space: nowrap;
}


.drawermenu_1list_box ul.drawermenu_list li ul.submenu{
	margin-top: 1rem;
	padding-left: 1rem;
	
}

.drawermenu_1list_box ul.drawermenu_list li ul.submenu li{
}

.drawermenu_1list_box ul.drawermenu_list li ul.submenu li a{
	font-size: 1.5rem;
	margin-left: 0px;
}

.drawermenu_1list_box ul.drawermenu_list li ul.submenu li a:before{
	content:"";
	display: inline-block;
	position: relative;
	vertical-align: middle;
	width: 1.5rem;
	height: 1px;
	margin-right: 0.5rem;
	background-color: #767676;
	margin-top: -3px;
}




/* ハンバーガーメニュー */
/*中身のハンバーガーメニュー部分のstyleは「drawer.css」に記載*/

.btn_drawermenu{
	display: none;
}








/* -------------------------------- 

 コンテンツ欄
 
-------------------------------- */

.anker{
	margin-top:-124px;
	padding-top: 124px;
}


/* -------------------------------- 

 パララックス設定

-------------------------------- */

/*フェードイン及びちょっと上に移動*/
.fadeInUp {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeInUp;
 animation-name: fadeInUp;
 visibility: visible !important;
 opacity: 0;
}

@keyframes fadeInUp {
	0% { opacity: 0;
		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		transform: translateY(20px);
		}
	100% { opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		transform: translateY(0);
		}
}

/*--------------------*/

/*ディレイ（待機時間）※他のアニメーションとの併用*/
.delay_01 {animation-delay: 0.1s;}
.delay_02 {animation-delay: 0.2s;}
.delay_03 {animation-delay: 0.3s;}
.delay_04 {animation-delay: 0.4s;}
.delay_05 {animation-delay: 0.5s;}
.delay_06 {animation-delay: 0.6s;}
.delay_07 {animation-delay: 0.7s;}
.delay_08 {animation-delay: 0.8s;}
.delay_09 {animation-delay: 0.9s;}
.delay_1 {animation-delay: 1.0s;}
.delay_11 {animation-delay: 1.1s;}
.delay_12 {animation-delay: 1.2s;}
.delay_13 {animation-delay: 1.3s;}
.delay_14 {animation-delay: 1.4s;}
.delay_15 {animation-delay: 1.5s;}
.delay_16 {animation-delay: 1.6s;}
.delay_17 {animation-delay: 1.7s;}
.delay_18 {animation-delay: 1.8s;}
.delay_19 {animation-delay: 1.9s;}
.delay_2 {animation-delay: 2.0s;}
.delay_25 {animation-delay: 2.5s;}
.delay_3 {animation-delay: 3.0s;}
.delay_35 {animation-delay: 3.5s;}
.delay_4 {animation-delay: 4.0s;}
.delay_45 {animation-delay: 4.5s;}
.delay_5 {animation-delay: 5.0s;}

.delay_10 {animation-delay: 10.0s;}




/*フェードイン（ぼかし無し）*/
.fadeIn {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeIn;
 animation-name: fadeIn;
 visibility: visible !important;
 opacity: 0;
}

@keyframes fadeIn {
	0% { opacity: 0;

		}
	100% { opacity: 1;

		}
}


/*--------------------*/

/*フェードイン（ぼかしあり）*/
.fadeInBlur {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeInBlur;
 animation-name: fadeInBlur;
 visibility: visible !important;
 opacity: 0;
}


@keyframes fadeInBlur {
	0% { opacity: 0;
		filter: blur(30px);
		-webkit-filter: blur(30px);
		}
	100% { opacity: 1;
		filter: blur(0px);
		-webkit-filter: blur(0px);
		}
}

/*フェードイン（ぼかしあり）3秒かけて遷移*/
.fadeInBlur_For3sec {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:3s;
 -ms-animation-duration:3s;
 animation-duration:3s;
 -webkit-animation-name: fadeInBlur_For3sec;
 animation-name: fadeInBlur_For3sec;
 visibility: visible !important;
 opacity: 0;
}


@keyframes fadeInBlur_For3sec {
	0% { opacity: 0;
		filter: blur(30px);
		-webkit-filter: blur(30px);
		}
	100% { opacity: 1;
		filter: blur(0px);
		-webkit-filter: blur(0px);
		}
}

/*--------------------*/


/*スライドシャッター（半透明の白で隠しておいてシャーッと開く）*/
.slideShutter {
	overflow: hidden;
	
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-ms-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-name: slideShutter_base;
	animation-name: slideShutter_base;
	visibility: visible !important;
	opacity: 1;
	z-index: 1;
}

@keyframes slideShutter_base {
	0% {
		opacity: 0;
		}
	100% {
		opacity: 1;	
		}
}

.slideShutter:after{
	content: "";
	display: block;
	position: absolute;
	top:0;
	right: 0;
	height: 100%;
	width: 100%;
	background-color: rgba(255,255,255,0.7);
		
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
	-webkit-animation-duration:1s;
	-ms-animation-duration:1s;
	animation-duration:1s;
	-webkit-animation-name: slideShutter_coverbg;
	animation-name: slideShutter_coverbg;
	visibility: visible !important;
	opacity: 1;
	z-index: 1;
}


@keyframes slideShutter_coverbg {
	0% {
		right: 0;
		}
	20% {
		right: 0;
		}
	90% {
		right: 100%;
		}
	100% {
		right: 100%;	
		}
}

/*--------------------*/






/*------------------------------

フッター

------------------------------*/

#footer{
	display: block;
	position: relative;
	z-index: 2;
	/*min-width: 1260px;*/
	
}

/**/
.footer_contact_box{
	display: block;
	position: relative;
	/*min-width: 1260px;*/
	margin: 0 auto;
}

.footer_contact_box_inner{
	display: block;
	position: relative;
	margin: 0 auto;
}

.footer_content_box{
	display: block;
	position: relative;
	margin: 0 auto;
	background-color: #333333;
	border-top: solid 1px #ffffff;
}

.footer_content_box_inner{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple;
	position: relative;
	margin: 0 auto;
}

.footer_contact_link{
	
}

.footer_contact_link a{
	display: flex;
	justify-content: center; /* 子要素をflexboxにより左右中央に配置する */
	align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
	padding: 60px 60px 60px 60px;
	background-color: #2494d6;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.footer_contact_link a:hover{
	background-color: #228bc8;
}

.footer_contact_text{
	padding-left: 3vw;
	font-size: 1.8rem;
	font-weight: 600;
	color: #ffffff;
}


.footer_company_name_box{
	display: flex; /* 子要素をflexboxで揃える */
	flex-direction: column; /* 子要素をflexboxにより縦並びに揃える */
	justify-content: center; /* 子要素をflexboxにより左右中央に配置する */
	align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
	position: relative;
	letter-spacing: normal;
	padding: 40px 70px 40px 70px;
	border-right: solid 1px #ffffff;
}

.footer_company_logo{
	display: inline-block;
	position: relative;
	
	width: 124px;
	height: 96px;
}

.footer_company_logo a{
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}


.footer_company_tel_box{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	flex-direction: column; /* 子要素をflexboxにより縦並びに揃える */
	letter-spacing: normal;
	padding: 40px 60px 40px 60px;
	text-align: left;
	margin-bottom: 20px;
	
}

.footer_tel{
	display: inline-block;
	text-align: left;
	font-size: 2.2rem;
	color: #ffffff;
}

.footer_tel span{
	display: inline-block;
	margin-right: 5px;
	font-size: 1.7rem;
}

.footer_tel a{
	pointer-events: none;
	color: #ffffff;
	margin-right: 2vw;
}

.footer_time{
	display: inline-block;
	color: #ffffff;
}

.footer_time span{
	font-size: 1.5rem;
}

.footer_address{
	color: #ffffff;
}

.footer_gmap{
	color: #ffffff;
}

.footer_gmap a{
	color: #ffffff;
	text-decoration: underline;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.footer_gmap a:after{
	content:"";
	display: inline-block;
	position: relative;
	width: 16px;
	height: 16px;
	background: url("../img/icon_marker_white.svg") no-repeat center center;
	background-size: contain;
	margin-left: 3px;
	top:3px;
}

.footer_gmap a:hover{
	opacity: 0.9;
}


/*コピーライト*/
.footer_copyright{
	display: block;
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 10px 80px 20px 10px;
}

.footer_copyright_inner{

}

.footer_copyright_inner p{
	color: #ffffff;
	font-size: 1.4rem;
	white-space: nowrap;
	line-height: 100%;
	text-align: right;
}





/* ----------ページTOPへボタン---------- */
#pagetop_wrapper {

	position: fixed;
	
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	right: 0px;
	bottom: 0px;
	width: 60px;
	height: 60px;
	padding: 0;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
	z-index: 100;
}

.pagetop{
	display: inline-block;
	position: relative;
	width: 60px;
	height: 60px;
}

/*a*/
.pagetop a {
	display: inline-block;
	position: relative;
	
	width: 60px;
	height: 60px;
	background: url("../img/pagetop.svg") no-repeat center center;
	background-size: contain;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}



.pagetop a:hover {
	opacity: 0.8;
}

.pagetop a span {
	display:none;
}











/*------------------------------

各パーツ設定

------------------------------*/



/*文字を一文字ずつディレイで表示*/
.delay_text{
	
}

.text_delay_animation:nth-Child(1){
	-webkit-animation: text_SlideFadeDelay 0.4s ease-in-out;
			animation: text_SlideFadeDelay 0.4s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(2){
	-webkit-animation: text_SlideFadeDelay 0.6s ease-in-out;
			animation: text_SlideFadeDelay 0.6s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(3){
	-webkit-animation: text_SlideFadeDelay 0.8s ease-in-out;
			animation: text_SlideFadeDelay 0.8s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(4){
	-webkit-animation: text_SlideFadeDelay 1.0s ease-in-out;
			animation: text_SlideFadeDelay 1.0s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(5){
	-webkit-animation: text_SlideFadeDelay 1.2s ease-in-out;
			animation: text_SlideFadeDelay 1.2s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(6){
	-webkit-animation: text_SlideFadeDelay 1.4s ease-in-out;
			animation: text_SlideFadeDelay 1.4s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(7){
	-webkit-animation: text_SlideFadeDelay 1.6s ease-in-out;
			animation: text_SlideFadeDelay 1.6s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(8){
	-webkit-animation: text_SlideFadeDelay 1.8s ease-in-out;
			animation: text_SlideFadeDelay 1.8s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(9){
	-webkit-animation: text_SlideFadeDelay 2.0s ease-in-out;
			animation: text_SlideFadeDelay 2.0s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}

.text_delay_animation:nth-Child(10){
	-webkit-animation: text_SlideFadeDelay 2.2s ease-in-out;
			animation: text_SlideFadeDelay 2.2s ease-in-out;
	-webkit-animation-fill-mode:both;
	-ms-animation-fill-mode:both;
	animation-fill-mode:both;
}




@-webkit-keyframes text_SlideFadeDelay {
	0% { opacity: 0; margin-left:-1rem; }
	100% { opacity: 1; margin-left:0rem; }
}

@keyframes stext_SlideFadeDelay {
	0% { opacity: 0; margin-left:-1rem; }
	100% { opacity: 1; margin-left:0rem; } 
}






.section_content_box{
	display: block;
	position: relative;
	padding-left: 3rem;
	padding-right: 3rem;
	padding-bottom: 3rem;
}



/* -------------------- H1 -------------------- */

h1{
	font-size: 4.6rem;
	line-height: 150%;
}



/* -------------------- H2 -------------------- */

h2{
	font-size: 3.6rem;
	line-height: 150%;
}


/* -------------------- H3 -------------------- */

h3{
	font-size: 2.8rem;
	line-height: 150%;
}


/* -------------------- H4/H5/H6 見出し設定 -------------------- */

h4{
	font-size: 2.2rem;
}

h5{
	font-size: 1.8rem;
}

h6{
	font-size: 1.6rem;
}

/* ---------- 記事のpノーマル ---------- */

/*コメントタグをpダグで入れる場合に使用（<p class="comment">コメント</p>）*/
p.comment {
	display: none;
}

/*右にfloatさせる　主にpタグに指定*/
.float_left{
	float: left;
	padding-right: 10px;
}

.float_none{
	float:none;
	margin-right: 0px;
}

/* ---------- 文字装飾いろいろ ---------- */

/*サイズアップ*/
.fs_100{font-size:100% !important;}
.fs_105{font-size:105% !important;}
.fs_110{font-size:110% !important;}
.fs_120{font-size:120% !important;}
.fs_130{font-size:130% !important;}
.fs_140{font-size:140% !important;}
.fs_150{font-size:150% !important;}
.fs_160{font-size:160% !important;}
.fs_170{font-size:170% !important;}
.fs_180{font-size:180% !important;}
.fs_190{font-size:190% !important;}
.fs_200{font-size:200% !important;}
.fs_210{font-size:210% !important;}
.fs_220{font-size:220% !important;}
.fs_230{font-size:230% !important;}
.fs_240{font-size:240% !important;}
.fs_250{font-size:250% !important;}
.fs_260{font-size:260% !important;}
.fs_270{font-size:270% !important;}
.fs_280{font-size:280% !important;}
.fs_290{font-size:290% !important;}
.fs_300{font-size:300% !important;}

/*サイズダウン*/
.fs_95{font-size:95%;}
.fs_90{font-size:90%;}
.fs_85{font-size:85%;}
.fs_80{font-size:80%;}
.fs_75{font-size:75%;}
.fs_70{font-size:70%;}
.fs_60{font-size:60%;}
.fs_50{font-size:50%;}
.fs_40{font-size:40%;}
.fs_30{font-size:30%;}
.fs_20{font-size:20%;}
.fs_10{font-size:10%;}

/*色*/
.fc_red{color:#de0000 !important}
.fc_blue{color:rgb(0, 174, 175, 1) !important}
.fc_liteblue{color:rgba(48, 179, 199, 0.2) !important}
.fc_blue2{color:#46aee4 !important}
.fc_emerald{color:rgb(0, 174, 175, 1) !important}
.fc_skyblue{color:#6699cc !important}
.fc_green{color:#17cd6b !important}
.fc_green2{color:#26A28E !important}
.fc_lightgreen,
.fc_litegreen{color:#99cc66 !important}
.fc_orange{color:#ffcc33 !important}
.fc_orange2{color:#E66000 !important}
.fc_purple{color:#663399 !important}
.fc_lightpurple,
.fc_litepurple{color:#cc99cc !important}
.fc_brown{color:#996633 !important}
.fc_gray{color:#999999 !important}
.fc_darkgray{color:#666666 !important}
.fc_white{color:#ffffff !important}

/*書体*/
/*明朝*/
.ff_sans-serif{
	font-family: 'Noto Serif JP',"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

/*ゴシック*/
.ff_serif{
	font-family: 'Noto Sans JP',YakuHanJP,"Kinto Sans","Helvetica Neue","Segoe UI",Helvetica,"游ゴシック体",YuGothic,"Yu Gothic M","游ゴシック Medium","Yu Gothic Medium","メイリオ",Meiryo,sans-serif;
}


/*左右中央揃え　text-alignの略*/
.ta_center{text-align: center !important;}
.ta_left{text-align: left !important;}
.ta_right{text-align: right !important;}


/*フォントウェイト*/
.fw_100{font-weight: 100;}
.fw_200{font-weight: 200;}
.fw_300{font-weight: 300;}
.fw_400{font-weight: 400;}
.fw_500{font-weight: 500;}
.fw_600{font-weight: 600;}
.fw_700{font-weight: 700;}
.fw_800{font-weight: 800;}
.fw_900{font-weight: 900;}

.bold,
.strong{
	font-weight: bold;
}


/*縦書きのキャッチコピー*/
.tategaki{
	display: inline-block;
	/*font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;*/
	text-align: left;
	
	line-height: 2.0;
	margin-top: 0rem;
	background: none;
	
	-webkit-writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
			writing-mode: vertical-rl;
}

.tategaki_kaijyo{
	-webkit-writing-mode:horizontal-tb;
	-ms-writing-mode:lr-tb;
	writing-mode:horizontal-tb;
}



/* ---------- 写真の配置設定 ---------- */

/*WPのメディアライブラリから挿入されたとき、自動的に挿入されるdivのclass*/
.wp-caption {
}

.wp-caption img {
	margin: 0;
	padding: 0;
	border: 0 none;
	
	max-width: 100%;
	height: auto;
}




/* ---------- 画像配置関連 キャプション付きの回し込み ---------- */

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


/*画像とキャプション両方を囲んだDIVのクラス設定：回り込み無し*/
.alignone{
	display: block;
	width: 100%!important;
	margin-bottom: 10px;
	clear: left;
}

/*画像とキャプション両方を囲んだDIVのクラス設定：中央揃え*/
.aligncenter {
	display: block;
	text-align: center;
	margin: 0 auto;
	margin-bottom: 10px;
	clear: left;
	float: none;
}

img.aligncenter {
	display: block;
	width:auto;
	text-align: center;
	margin:0 auto;
	margin-bottom: 10px;
	clear: left;
}

/* ----------写真を中央に配置---------- */
.aligncenter img {
	display: block;
	margin: 0 auto 0px auto!important;
	height: auto;
}


/*画像とキャプション両方を囲んだDIVのクラス設定：画像が右寄せになる場合*/
.alignright {
	text-align: right;
	float: right;
	padding-left: 40px;
	margin-bottom: 10px;
}

/*画像とキャプション両方を囲んだDIVのクラス設定：画像が左寄せになる場合*/
.alignleft {
	text-align: left;
	float: left;
	padding-right: 40px;
	margin-bottom: 10px;
}

/* ----------写真を左に配置---------- */
.alignleft img {
	height: auto;
	margin-bottom: 10px;
	float: none;
}

/* ----------写真を右側に配置---------- */
.alignright img {
	margin-bottom: 10px;
	float: none;
}

/*キャプションのスタイル（alignnone、alignleft、alignrightの場合）*/
.wp-caption-text,
.alignleft .wp-caption-text {
	display: block;
	text-align: left;
	font-size: 90%;
	line-height: 140%;
	color: #797979;
	clear: both;
	padding-top: 5px;
	padding-bottom: 5px;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}


.alignright .wp-caption-text {
	display: block;
	width: 100%;
	text-align: left;
	font-size: 90%;
	line-height: 140%;
	color: #797979;
	clear: both;
	
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/*キャプションのスタイル（aligncenterの場合）*/
.aligncenter .wp-caption-text{
	text-align: center;
	font-size: 90%;
	line-height: 140%;
	color: #797979;
	clear: both;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/*imgにグレーの枠線*/
img.border_gray{
	border: #dadada solid 1px;
}


/*写真をトリミングして配置*/
/*JS「ofi.min.js」と併用*/
.fit {
	object-fit: cover;
	object-position: bottom;
	font-family: 'object-fit: cover; object-position: bottom;'
}


.trim {
	display: block;
	overflow: hidden;
	position: relative;
	width: 100%;
	padding-bottom: 75%;/*4:3*/
	margin-bottom: 10px;
}


.trim.w10per{
	width: 10%;
	padding-bottom: 7.5%;
}

.trim.w20per{
	width: 20%;
	padding-bottom: 15%;
}

.trim.w30per{
	width: 30%;
	padding-bottom: 22.5%;
}

.trim.w40per{
	width: 40%;
	padding-bottom: 30%;
}

.trim.w50per{
	width: 50%;
	padding-bottom: 37.5%;
}

.trim.w60per{
	width: 60%;
	padding-bottom: 45%;
}

.trim.w70per{
	width: 70%;
	padding-bottom: 52.5%;
}

.trim.w80per{
	width: 80%;
	padding-bottom: 60%;
}

.trim.w90per{
	width: 90%;
	padding-bottom: 67.5%;
}

.trim.w100per{
	width: 100%;
	padding-bottom: 75%;
}



.trim_wide {
	display: block;
	overflow: hidden;
	position: relative;
	width: 100%;
	padding-bottom: 56.625%;/*16:9*/
	margin-bottom: 10px;
}

.trim_wide.w10per{
	width: 10%;
	padding-bottom: 5.6625%;
}

.trim_wide.w20per{
	width: 20%;
	padding-bottom: 11.325%;
}

.trim_wide.w30per{
	width: 30%;
	padding-bottom: 17%;
}

.trim_wide.w40per{
	width: 40%;
	padding-bottom: 22.65%;
}

.trim_wide.w50per{
	width: 50%;
	padding-bottom: 28.3125%;
}

.trim_wide.w60per{
	width: 60%;
	padding-bottom: 33.975%;
}

.trim_wide.w70per{
	width: 70%;
	padding-bottom: 39.6375%;
}

.trim_wide.w80per{
	width: 80%;
	padding-bottom: 45.3%;
}

.trim_wide.w90per{
	width: 90%;
	padding-bottom: 50.9625%;
}

.trim_wide.w100per{
	width: 100%;
	padding-bottom: 56.625%;
}

/* 中央に合わせて、リサイズせずに、はみ出た分をトリミング(画像に対するCSS) */
.trim img,
.trim_wide img {
	position: absolute;
	width: 100%;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.alignleft.trim img,
.alignleft.trim_wide img {
	width: 98%;
	width : -webkit-calc(100% - 20px) ;
	width : calc(100% - 20px) ;
	left: 49%;
	left : -webkit-calc(50% - 10px) ;
	left : calc(50% - 10px) ;
}

.alignright.trim img,
.alignright.trim_wide img {
	width: 98%;
	width : -webkit-calc(100% - 20px) ;
	width : calc(100% - 20px) ;
	left: 49%;
	left : -webkit-calc(50% + 10px) ;
	left : calc(50% + 10px) ;
}

.alignleft.trim.w100 img,
.alignleft.trim_wide.w100 img,
.alignright.trim.w100 img,
.alignright.trim_wide.w100 img {
	position: absolute;
	width: 100%;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

/* 右寄せで写真を縦に並べるカラム状のボックス */

.photo_column_right{
	float:right;
	margin-left:30px;
}


/*画像のフチをぼかす　画像を囲んだタグに使う*/
.blur, .blur > img {
	margin: 0; padding: 0;
	border: 0;
}

.blur {
	position: relative;
	display: inline-block;
	font-size: 0;
	line-height: 0;
}

.blur:after {
	position: absolute;
	left: 0; top: 0; right: 0; bottom: 0;
	-moz-box-shadow: inset 0px 0px 15px 15px #fff;
	-webkit-box-shadow: inset 0px 0px 15px 15px #fff;
	box-shadow: inset 0px 0px 15px 15px #fff;
	content: " ";
}


/*alignleft、alignright等と併記して、横幅を%可変にする*/
.w10per{width: 10% !important;}
.w15per{width: 15% !important;}
.w20per{width: 20% !important;}
.w25per{width: 25% !important;}
.w30per{width: 30% !important;}
.w35per{width: 35% !important;}
.w40per{width: 40% !important;}
.w45per{width: 45% !important;}
.w50per{width: 50% !important;}
.w55per{width: 55% !important;}
.w60per{width: 60% !important;}
.w65per{width: 65% !important;}
.w70per{width: 70% !important;}
.w75per{width: 75% !important;}
.w80per{width: 80% !important;}
.w85per{width: 85% !important;}
.w90per{width: 90% !important;}
.w95per{width: 95% !important;}
.w100per{width: 100% !important;}
.w110per{width: 110% !important;}
.w120per{width: 120% !important;}

.w10per img,
.w20per img,
.w30per img,
.w40per img,
.w50per img,
.w60per img,
.w70per img,
.w80per img,
.w90per img,
.w100per img,
.w110per img,
.w120per img{
	width: 100%;
	max-width: 100%;
	height: auto;
}

/*横幅ピクセル指定*/
.w10px{width: 10px !important;}
.w20px{width: 20px !important;}
.w30px{width: 30px !important;}
.w40px{width: 40px !important;}
.w50px{width: 50px !important;}
.w60px{width: 60px !important;}
.w70px{width: 70px !important;}
.w80px{width: 80px !important;}
.w90px{width: 90px !important;}
.w100px{width: 100px !important;}
.w110px{width: 110px !important;}
.w120px{width: 120px !important;}
.w130px{width: 130px !important;}
.w140px{width: 140px !important;}
.w150px{width: 150px !important;}
.w160px{width: 160px !important;}
.w170px{width: 170px !important;}
.w180px{width: 180px !important;}
.w190px{width: 190px !important;}
.w200px{width: 200px !important;}
.w300px{width: 300px !important;}
.w400px{width: 400px !important;}
.w500px{width: 500px !important;}
.w600px{width: 600px !important;}


.w10px img,
.w20px img,
.w30px img,
.w40px img,
.w50px img,
.w60px img,
.w70px img,
.w80px img,
.w90px img,
.w100px img,
.w110px img,
.w120px img,
.w130px img,
.w140px img,
.w150px img,
.w160px img,
.w170px img,
.w180px img,
.w190px img,
.w200px img{
	width: 100%;
	max-width: 100%;
	height: auto;
}

.mw400px{max-width: 400px !important; width: 100%;}
.mw500px{max-width: 500px !important; width: 100%;}


/*角丸指定*/
.r1{border-radius: 1px;}
.r2{border-radius: 2px;}
.r3{border-radius: 3px;}
.r4{border-radius: 4px;}
.r5{border-radius: 5px;}
.r6{border-radius: 6px;}
.r7{border-radius: 7px;}
.r8{border-radius: 8px;}
.r9{border-radius: 9px;}
.r10{border-radius: 10px;}



/* ---------- 記事内のテーブル設定 ---------- */

table {
	margin-bottom: 0.5rem;
	border-top: #dadada solid 1px;
	border-left: #dadada solid 0px;
}

table.table_90per {
	width: 90% !important;
}

table.table_80per {
	width: 80% !important;
}

table.table_70per {
	width: 70% !important;
}

table.table_60per {
	width: 60% !important;
}

table.table_50per {
	width: 50% !important;
}

table.table_40per {
	width: 40% !important;
}

table.table_30per {
	width: 30% !important;
}

table.table_20per {
	width: 20% !important;
}

table.table_10per {
	width: 10% !important;
}

tr {
	border-bottom: #dadada solid 1px;
	border-right: #dadada solid 0px;
}

th {
	padding: 15px 10px 15px 10px;

	/*background-color: #f9f9f9;*/
	/*white-space: nowrap;*/
	border-bottom: #dadada solid 1px;
	border-right: #dadada solid 0px;
	font-weight: normal !important;
	font-size: 94%;
}

table.noline,
table.noline tr,
table.noline td,
table.noline th{
	border: 0px !important;
}



.sub_td_bg {
}

.sub_td_bg_gray {
	background-color: #EDEDE9;
}

.sub_td_bg_white {
	background-color: #ffffff;
}


td {
	padding: 15px 10px 15px 10px;
	border-bottom: #dadada solid 1px;
	border-right: #dadada solid 0px;
}

table.border-print td {
}

table.table_2column {
	margin-bottom: 0.5rem;
	border-top: #dadada solid 1px;
	border-left: #dadada solid 0px;
	width: 49%;
	float: left;
	margin-right: 1%;
}

table.table_4column {
	margin-bottom: 0.5rem;
	border-top: #dadada solid 1px;
	border-left: #dadada solid 0px;
	width: 24%;
	float: left;
	margin-right: 1%;
}


/*スマホレスポンシブ対応のテーブル*/
table.sp_responsive_table {
}

table.sp_responsive_table .sp_only {
	display: none;
}

/*改行させない*/
.nowrap,
table tr.nowrap,
table tr th.nowrap,
table tr td.nowrap,
p.nowrap,
span.nowrap{
	white-space: nowrap !important;
}

/*横並びの画像をスマホでも横並びのまま表示するtable　のstyle*/
table.table_img_2column,
table.table_img_2column tr {
	max-width: 1140px !important;
}

table.table_img_2column,
table.table_img_2column tr,
table.table_img_2column th,
table.table_img_2column td {
	border: 0px;
	border: none;
	padding: 0px 0px 0px 0px;
}

table.table_img_2column td:first-child {
	padding: 0px 10px 0px 0px;
}

table.table_img_2column td:last-child {
	padding: 0px 0px 0px 10px;
}

table.table_img_2column img{
	width: 100% !important;
	height: auto;
}


/*tableタグにこのclassが指定されているtableの中に入れ子になっているtableから罫線を取る*/
/*学科の教育科目のtableなど*/
.td_in_table td table,
.td_in_table td table th,
.td_in_table td table tr,
.td_in_table td table td{
	border: none !important;
	padding: 0px;
}

.td_in_table td table{
	margin-bottom: 0rem;
	width: auto !important;
}

.td_in_table td table td{
	margin-bottom: 0rem;
	width: 230px !important;
}

.td_in_table td table .td_bg_color_blue{
	background-color: #d8e1f1;
}


/*tdの上だけ、borderを太くする*/
table .border_top_3px{
	border-top: #dadada solid 3px !important;
}



/*一番上の項目行を左の列に可変テーブル（「no_responsive_table」と併記）*/
.td_change_table{
	width: 100%;
	border-top: #DBD8CC solid 1px;
	border-left: #DBD8CC solid 1px;
	margin-bottom: 10px !important;
}

table.td_change_table.w_auto{
	width: auto;
}

table.td_change_table tr {
	font-size:96% !important;
	line-height:150% !important;
	background-color: #ffffff;
}

table.td_change_table th {
	padding:4px 10px 4px 10px !important;
	font-size:96% !important;
	line-height:150% !important;
	white-space:nowrap !important;
	
	border-bottom: #DBD8CC solid 1px;
	border-right: #DBD8CC solid 1px;
	background-color: #C5C2B1;
	
	color: #ffffff;
	font-weight: 600;
}

table.td_change_table td {
	padding:10px 10px 10px 10px !important;
	font-size:96% !important;
	line-height:130% !important;
	
	border-bottom: #DBD8CC solid 1px;
	border-right: #DBD8CC solid 1px;

}

table.td_change_table td p {
	line-height:130% !important;
}




/* -------------------- 水平線画像 -------------------- */

hr{
	display:block;
	width:100%;
	height:1px;
	margin-top: 3rem;
	margin-bottom: 3rem;
	border:none;
	border:0;
	background:#dadada;
	clear:both;
	float:none;
}

hr.hr_white{
	display:block;
	width:100%;
	height:1px;
	margin-top: 3rem;
	margin-bottom: 3rem;
	border:none;
	border:0;
	background:#ffffff;
	clear:both;
	float:none;
}

hr.hr_dot,
hr.hr_dot_green{
	display:block;
	width:100%;
	height:1px;
	margin-top: 3rem;
	margin-bottom: 3rem;
	border:none;
	border-top:dotted 1px #dadada;
	color:#ffffff;
	background:#ffffff;
	clear:both;
	float:none;
}

hr.hr_dot_green{
	border-top: dotted 1px rgba(0, 174, 175, 1);
}

/* ---------- 記事内の横幅制限（div） ---------- */

.mw_740{
	margin: 0 auto;
	max-width: 740px;
}

.mw_780{
	margin: 0 auto;
	max-width: 780px;
}

.mw_860{
	margin: 0 auto;
	max-width: 860px;
}

/* ---------- 記事内のグレー罫線の囲み（div） ---------- */

.box_gray{
	padding:35px 35px 35px 35px;
	margin-top: 10px;
	margin-bottom: 25px;
	border: solid 1px #dadada;
}

.box_green{
	padding:3vw 3.8vw 3vw 3.8vw;
	margin-top: 10px;
	margin-bottom: 25px;
	border: solid 1px rgba(0, 174, 175, 1) ;
}

.box_emerald{
	padding:3vw 3.8vw 3vw 3.8vw;
	margin-top: 10px;
	margin-bottom: 25px;
	border: solid 1px rgb(0, 174, 175, 1);
}

.box_white{
	padding:3vw 3.8vw 3vw 3.8vw;
	margin-top: 10px;
	margin-bottom: 25px;
	border: solid 0px #d2d2d2;
	background-color: #ffffff;
}

.box_gray_compact {
	padding:2.2vw 2.8vw 2.2vw 2.8vw;
	margin-top: 10px;
	margin-bottom: 25px;
	border: solid 1px #dadada;
	line-height: 150%;
}

.box_green_compact {
	padding:2.2vw 2.8vw 2.2vw 2.8vw;
	margin-top: 10px;
	margin-bottom: 25px;
	border: solid 1px rgba(0, 174, 175, 1) ;
	line-height: 150%;
}

.box_white_compact {
	padding:2.2vw 2.8vw 2.2vw 2.8vw;
	margin-top: 10px;
	margin-bottom: 25px;
	border: solid 0px #d2d2d2;
	line-height: 150%;
}



/* 背景が薄いグレーのボックス */
.box_bg_gray{
	padding:35px 35px 35px 35px;
	margin-top: 10px;
	margin-bottom: 25px;
	background-color:rgba(231, 228, 227, 0.5);
}

/* 背景が薄いブルーのボックス */
.box_bg_blue{
	padding:35px 35px 35px 35px;
	margin-top: 10px;
	margin-bottom: 25px;
	background-color:rgba(221, 233, 234, 0.7);
}

/* 背景が白のボックス */
.box_bg_white{
	background-color:#ffffff;
	padding:35px 35px 35px 35px;
	margin-top: 10px;
	margin-bottom: 25px;
}

/*「box_XX」と併記して利用　角丸*/
.r2{
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
}

.r3{
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}

.r4{
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}

.r5{
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}


/*「box_gray_XX」と併記して利用*/

/*inline-blockを追加する*/
.display_ib{
	overflow: hidden;
	display: inline-block;
}

.display_ib_va{
	overflow: hidden;
	display: inline-block;
	vertical-align: top;
}

/*スマホではblock*/
.sp_display_b{
	/*display: block;*/
}

/*テキストインデントを0にする*/
.no_indent{
	text-indent: 0px;
}



/* ---------- 記事内のol ---------- */

ol {
	margin-left: 0rem !important;
	padding-left: 2.6rem;
	padding-bottom: 8px;
	list-style-type: decimal;
}

ol > li {
	padding: 2px 0px 6px 0rem;
	text-indent: 0rem;
}

ol > li > ul {
	padding-left: 1.5rem;
}


ol > li > ul li{
	list-style:none;
}

ol > li > ul li:before{
	display: inline-block;
	content: "\025cf";
	text-align: center;
	font-size: 5px;
	color: #0D468F;
	margin-right: 10px;
	vertical-align: middle;
	margin-left: -1.5rem;
}


/* ---------- 記事内のul ---------- */


ul {
	list-style:none;
	background: none;
	padding: 0px 0px 0px 0px;
	letter-spacing: -.40em;
}

ul li{
	padding-left:0px;
	/*
	background-image:url(../img/icon_32_disc_black.png) ;
	background-size: 16px 16px;
	*/
	background-repeat:no-repeat;
	background-position:0 6px;
	letter-spacing: normal;
}



ul.disc {
	padding-left: 2rem;
}

ul.disc li{
	list-style:none;
}

ul.disc li:before{
	display: inline-block;
	content: "\025cf";
	text-align: center;
	font-size: 5px;
	margin-right: 10px;
	margin-left: -1.5rem;
	margin-top: -2px;
	vertical-align: middle;	
}

ul.circle_blue {
	padding-left: 1.5rem;
}

ul.circle_blue li{
	list-style:none;
	line-height: 130%;
	margin-bottom: 5px;
}

ul.circle_blue li:before{
	display: inline-block;
	content: "\025cf";
	text-align: center;
	font-size: 9px;
	margin-right: 5px;
	margin-left: -1.5rem;
	margin-top: -1px;
	vertical-align: middle;	
	color: rgb(0, 174, 175, 1) !important;
}





ul.list_inline5 li {
	display: inline-block;
	width: 20%;
}

/*画面幅940px未満*/
@media (max-width: 940px) {
	ul.list_inline5 li {
		width: 25%;
	}
}

/*画面幅414px未満*/
@media (max-width: 414px) {
	ul.list_inline5 li {
		width: 100%;
	}
}


ul li:before{	
}

 ul.float{
	float: none;
	clear: both;
}

 ul.float li {
	display: inline-block;
	padding: 2px 10px 4px 0px;
	float: left;
	background:none;
}


/*先頭のディスクを付けない場合、ulにこのclassを指定「no_disc」*/
ul.no_disc {
	padding-left: 2rem;
}

ul.no_disc li {

}

ul.no_disc li:before {
	content:none;
}

ul.no_disc li ul li {

}

/* ---------- 記事内のア、イ、ウ…のliのul ---------- */

.list_50on,
ul li .list_50on {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style:none !important;
	background: none !important;
}

.list_50on li,
 ul li .list_50on li {
	padding-left: 1rem !important;
	text-indent: -1rem !important;
	list-style:none !important;
	background: none !important;
}


/* ---------- ulを○文字分で揃えるのliのul ---------- */

.list_1em,
ul li .list_1em,
.list_1rem,
ul li .list_1rem {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style:none !important;
	background: none !important;
}

span.list_1em,
.list_1em li,
 ul li .list_1em li,
 span.list_1rem,
.list_1rem li,
 ul li .list_1rem li {
	padding-left: 1.0rem !important;
	text-indent: -1.0rem !important;
	list-style:none !important;
	background: none !important;
}

.list_1_5em,
ul li .list_1_5em,
.list_1_5rem,
ul li .list_1_5rem {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style:none !important;
	background: none !important;
}

span.list_1_5em,
.list_1_5em li,
 ul li .list_1_5em li,
 span.list_1_5rem,
.list_1_5rem li,
 ul li .list_1_5rem li {
	padding-left: 1.5rem !important;
	text-indent: -1.5rem !important;
	list-style:none !important;
	background: none !important;
}

.list_2em,
ul li .list_2em,
.list_2rem,
ul li .list_2rem {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style:none !important;
	background: none !important;
}

span.list_2em,
.list_2em li,
 ul li .list_2em li,
 span.list_2rem,
.list_2rem li,
 ul li .list_2rem li {
	padding-left: 2.0rem !important;
	text-indent: -2.0rem !important;
	list-style:none !important;
	background: none !important;
}


.list_2_5em,
ul li .list_2_5em,
.list_2_5rem,
ul li .list_2_5rem {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style:none !important;
	background: none !important;
}

span.list_2_5em,
.list_2_5em li,
 ul li .list_2_5em li,
 span.list_2_5rem,
.list_2_5rem li,
 ul li .list_2_5rem li {
	padding-left: 2.5rem !important;
	text-indent: -2.5rem !important;
	list-style:none !important;
	background: none !important;
}

.list_3em,
ul li .list_3em,
.list_3rem,
ul li .list_3rem {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style:none !important;
	background: none !important;
}

span.list_3em,
.list_3em li,
 ul li .list_3em li,
 span.list_3rem,
.list_3rem li,
 ul li .list_3rem li {
	padding-left: 3.0rem !important;
	text-indent: -3.0rem !important;
	list-style:none !important;
	background: none !important;
}

.list_4em,
ul li .list_4em,
.list_4rem,
ul li .list_4rem {
	margin-left: 0 !important;
	padding-left: 0 !important;
	list-style:none !important;
	background: none !important;
}

span.list_4em,
.list_4em li,
 ul li .list_4em li,
 span.list_4rem,
.list_4rem li,
 ul li .list_4rem li {
	padding-left: 4.0rem !important;
	text-indent: -4.0rem !important;
	list-style:none !important;
	background: none !important;
}


/* ---------- 記事内の注釈 ---------- */

.annotate {
	/*padding: 6px 0px 6px 0px;*/
	font-size: 90%;
	color: #888;
}

.indent_1em,
.indent_1rem{
	padding-left: 1.0rem !important;
	text-indent: -1.0rem !important;
}

.indent_1_5em,
.indent_1_5rem{
	padding-left: 1.5rem !important;
	text-indent: -1.5rem !important;
}

.indent_2em,
.indent_2rem{
	padding-left: 2rem !important;
	text-indent: -2rem !important;
}

.indent_2_5em,
.indent_2_5rem{
	padding-left: 2.5rem !important;
	text-indent: -2.5rem !important;
}

.indent_3em,
.indent_3rem{
	padding-left: 3rem !important;
	text-indent: -3rem !important;
}

.indent_3_5em,
.indent_3_5rem{
	padding-left: 3.5rem !important;
	text-indent: -3.5rem !important;
}

.indent_4em,
.indent_4rem{
	padding-left: 4rem !important;
	text-indent: -4rem !important;
}

.indent_4_5em,
.indent_4_5rem{
	padding-left: 4.5rem !important;
	text-indent: -4.5rem !important;
}

.indent_8em,
.indent_8rem{
	padding-left: 8rem !important;
	text-indent: -8rem !important;
}

.indent_8_5em,
.indent_8_5rem{
	padding-left: 8.5rem !important;
	text-indent: -8.5rem !important;
}

.indent_9em,
.indent_9rem{
	padding-left: 9rem !important;
	text-indent: -9rem !important;
}





/*背景色付の項目見出し　span*/
.item_red,
.item_blue,
.item_skyblue,
.item_emerald,
.item_green,
.item_lightgreen,
.item_litegreen,
.item_orange,
.item_orange2,
.item_purple,
.item_lightpurple,
.item_litepurple,
.item_brown,
.item_gray,
.item_darkgray,
.item_white,
.item_subject1,
.item_subject2,
.item_subject3,
.item_subject4{
	display: inline-block;
	position: relative;
	text-align: center;
	/*vertical-align: text-top ;*/
	padding: 4px 4px 4px 4px;
	margin-top: 0px;
	line-height: 100% !important;
	background-color: #b7c833;
	letter-spacing: 0.05rem;
	letter-spacing: 0.05rem;
	text-indent: 0.05rem;
	min-width: 8rem;
	margin-right: 10px;
	font-size: 1.1rem;
	color: #FFFFFF;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
}

/*上記と併用して利用。Sサイズ*/
.item_s{
	padding: 4px 4px 4px 4px;
	min-width: 70px;
	margin-right: 10px;
	top: -2px;
	font-size: 1.1rem;
	color: #FFFFFF;
}

/*上記と併用して利用。Mサイズ*/
.item_m{
	padding: 4px 4px 4px 4px;
	min-width: 70px;
	top: -1px;
	margin-right: 10px;
	font-size: 1.4rem;
	color: #FFFFFF;
}

/*上記と併用して利用。Lサイズ*/
.item_l{
	padding: 6px 10px 6px 10px;
	min-width: 80px;
	margin-top: -4px;
	margin-right: 10px;
	font-size: 1.5rem;
	color: #FFFFFF;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}

.item_red{
	background-color: #ff3333;
}

.item_blue{
	background-color: #018BCE;
}

.item_skyblue{
	background-color: #6699cc;
}

.item_emerald{
	background-color: rgb(0, 174, 175, 1);
}

.item_green{
	background-color: rgb(0, 174, 175, 1);
}

.item_lightgreen,
.item_litegreen{
	background-color: #99cc66;
}

.item_orange{
	background-color: #ff9900;
}

.item_orange2{
	background-color: #ffcc33;
}

.item_purple{
	background-color: #663399;
}

.item_lightpurple,
.item_litepurple{
	background-color: #cc99cc;
}

.item_brown{
	background-color: #996633;
}

.item_gray{
	background-color: #999999;
}

.item_darkgray{
	background-color: #666666;
}

.item_white{
	color: #333333;
	background-color: #ffffff;
	border: 1px solid #dadada;
}


.flex{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	position: relative;
}

.flex ul,
.flex ol,
.flex div{
	padding-right: 4vw;
}

/* ---------- div内で2列にならべるdiv ---------- */

/*2列全体　div*/
.text_box_2column{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	overflow: hidden;
	position: relative;
}

.text_box_2column .column_inner{
	display: inline-block;
	position: relative;
	overflow: hidden;
	position: relative;
	width: 47%;
	margin-right: 6%;
}

.text_box_2column .column_inner:nth-child(2n){
	margin-right: 0%;
}

.text_box_2column.column_6_4 .column_inner:nth-child(1n){
	width: 50%;
}

.text_box_2column.column_6_4 .column_inner:nth-child(2n){
	width: 44%;
}

.text_box_2column.column_7_3 .column_inner:nth-child(1n){
	width: 70%;
}

.text_box_2column.column_7_3 .column_inner:nth-child(2n){
	width: 24%;
}


.text_box_2column .column_inner:nth-child(2n){
	margin-right: 0%;
}

.text_box_2column.column_4_6 .column_inner:nth-child(1n){
	width: 44%;
}

.text_box_2column.column_4_6 .column_inner:nth-child(2n){
	width: 50%;
}

.text_box_2column.column_3_7 .column_inner:nth-child(1n){
	width: 24%;
}

.text_box_2column.column_3_7 .column_inner:nth-child(2n){
	width: 70%;
}


/* ---------- div内で3列にならべるdiv ---------- */

/*3列全体　div*/
.text_box_3column,
.text_box_3column_narrow,
.text_box_3column_widthauto{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	overflow: hidden;
	position: relative;
}

.text_box_3column_left,/*左*/
.text_box_3column_center,/*中央*/
.text_box_3column_right,/*右*/
.text_box_3column .column_inner,
.text_box_3column_widthauto .column_inner{
	display: inline-block;
	position: relative;
	overflow: hidden;
	position: relative;
	width: 30%;
	margin-right: 5%;
	margin-bottom: 2%;
}

.text_box_3column_narrow .column_inner{
	width: 33%;
	margin-right: 0.5%;
}

.text_box_3column_widthauto .column_inner{
	width: auto;
	margin-right: 5%;
}



.text_box_3column_right,
.text_box_3column .column_inner:nth-child(3n),
.text_box_3column_narrow .column_inner:nth-child(3n),
.text_box_3column_widthauto .column_inner:nth-child(3n){
	margin-right: 0%;
}

.text_box_3column_left img,
.text_box_3column_center img,
.text_box_3column_right img,
.text_box_3column .column_inner img,
.text_box_3column_narrow .column_inner img,
.text_box_3column_widthauto .column_inner img{
	width: 100%;
	height: auto;
}



/* ---------- div内で4列にならべるdiv ---------- */

/*4列全体　div*/
.text_box_4column{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	overflow: hidden;
	position: relative;
}

.text_box_4column_1,/*左*/
.text_box_4column_2,/*中央*/
.text_box_4column_3,/*中央*/
.text_box_4column_4,/*右*/
.text_box_4column .column_inner{
	display: inline-block;
	position: relative;
	overflow: hidden;
	position: relative;
	width: 21.25%;
	margin-right: 5%;
	margin-bottom: 2%;
}

.text_box_4column_4,
.text_box_4column .column_inner:nth-child(4n){
	margin-right: 0%;
}

.text_box_4column_1 img,
.text_box_4column_2 img,
.text_box_4column_3 img,
.text_box_4column_4 img,
.text_box_4column .column_inner img{
	width: 100%;
	height: auto;
}


/*box_grayを併用した場合の調整*/
.column_inner.box_gray,
.box_gray.column_inner{
	margin-top: 0px;
}

.column_inner .button{
	min-width: 80%;
}



/* ----------リンクとダウンロードファイルのアイコン---------- */
/*aタグ用*/

/* ----------リンクとダウンロードファイルのアイコン---------- */

/*aタグ用*/

/*テキスト基本リンク*/

.icon_link:after {
	font-family: "Material Symbols Outlined";
	content: "\e5e1";
	display: inline-block;
	position: relative;
	width: 14px;
	height: 14px;
	font-size: 12px;
	margin-left: 5px;
	top: -2px;
	vertical-align: middle;
	line-height: normal;
}

.icon_link:hover {
	text-decoration: underline
}


/*blank*/
.icon_blank:after {
	font-family: "Material Symbols Outlined";
	content: "\e3e0";
	display: inline-block;
	position: relative;
	width: 14px;
	height: 14px;
	font-size: 14px;
	margin-left: 5px;
	top: -2px;
	vertical-align: middle;
	line-height: normal;
}

/*mail*/
.icon_mail:after {
	font-family: "Material Symbols Outlined";
	content: "\e158";
	display: inline-block;
	position: relative;
	width: 14px;
	height: 14px;
	font-size: 18px;
	margin-left: 5px;
	top: -2px;
	vertical-align: middle;
	line-height: normal;
}

/*mail 頭にアイコン*/
.icon_mail_frontmark:before {
	font-family: "Material Symbols Outlined";
	content: "\e158";
	display: inline-block;
	position: relative;
	width: 14px;
	height: 14px;
	font-size: 18px;
	margin-right: 7px;
	top: -2px;
	vertical-align: middle;
	line-height: normal;
}

/*pdf*/
.icon_pdf:after {
	font-family: "Material Symbols Outlined";
	content: "\e873";
	display: inline-block;
	position: relative;
	width: 16px;
	height: 16px;
	font-size: 18px;
	margin-left: 5px;
	top: -4px;
	vertical-align: middle;
	line-height: normal;
}

/*tel*/
.icon_tel:after {
	font-family: "Material Symbols Outlined";
	content: "\e0b0";
	display: inline-block;
	position: relative;
	width: 14px;
	height: 14px;
	font-size: 16px;
	margin-left: 5px;
	top: -4px;
	vertical-align: middle;
	line-height: normal;
}

/*search*/
.icon_search:after {
	font-family: "Material Symbols Outlined";
	content: "\e8b6";
	display: inline-block;
	position: relative;
	width: 18px;
	height: 18px;
	font-size: 18px;
	margin-left: 5px;
	top: -3px;
	vertical-align: middle;
	line-height: normal;
}

/*picture_zoom*/
.icon_picture_zoom:after {
	font-family: "Material Symbols Outlined";
	content: "\e3d3";
	display: inline-block;
	position: relative;
	width: 14px;
	height: 14px;
	font-size: 16px;
	margin-left: 5px;
	top: -3px;
	vertical-align: middle;
	line-height: normal;
}

/*基本ボタン　背景青緑、罫青緑*/
.button {
	display: inline-block;
	position: relative;
	text-align: center;
	font-size: 1.8rem;
	line-height: 130%;
	font-weight: 600;
	padding: 20px 1.5vw 20px 1.5vw;
	min-width: 200px;
	border: solid 2px #333333;
	text-decoration: none;
	margin-top: 6px;
	margin-bottom: 6px;
	
	z-index: 1;
	  
	  overflow: hidden;
	  transition: .3s;

}

.button:before {
  content: "";
  width: 120%;
  height: 200%;
  position: absolute;
  top: 0%;
  right: 0;
  z-index: -1;
  background: #2494d6;
  transform: translateY(100%);
  transition: transform ease .3s;
}

/*ボタンのときのアイコンの色*/
a.button.icon_link:after,
a.button.icon_blank:after,
a.button.icon_mail:after,
a.button.icon_mail_frontmark:before,
a.button.icon_pdf:after,
a.button.icon_tel:after,
a.button.icon_search:after,
a.button.icon_picture_zoom:after {
	color: #ffffff !important;
}

.button:hover {
	background-position: -100% 0;
	color: #ffffff !important;
	text-decoration: none;
}

.button:hover:before {
  transform: translateY(0%);
}

/*hoverしたときのボタンのときのアイコンの色*/
a.button.icon_link:hover:after,
a.button.icon_blank:hover:after,
a.button.icon_mail:hover:after,
a.button.icon_mail_frontmark:hover:before,
a.button.icon_pdf:hover:after,
a.button.icon_tel:hover:after,
a.button.icon_search:hover:after,
a.button.icon_picture_zoom:hover:after {
	color: #ffffff !important;
}


/*基本ボタン　背景青、罫青*/
.button_blue {
	display: inline-block;
	position: relative;
	text-align: center;
	font-size: 1.8rem;
	line-height: 130%;
	font-weight: 600;
	padding: 20px 1.5vw 20px 1.5vw;
	min-width: 200px;
	border: solid 2px #2494d7;
	background-color: #2494d7;
	color: #ffffff !important;
	text-decoration: none;
	margin-top: 6px;
	margin-bottom: 6px;
	
	z-index: 1;
		
		overflow: hidden;
		transition: .3s;
}

.button_blue:visited {
	color: #ffffff !important;
}

.button_blue:before {
  content: "";
	width: 120%;
	height: 200%;
	position: absolute;
	top: 0%;
	right: 0;
	z-index: -1;
	color: #2494d6;
	background: #ffffff;
	transform: translateY(100%);
	transition: transform ease .3s;
}

/*ボタンのときのアイコンの色*/
a.button_blue.icon_link:after,
a.button_blue.icon_blank:after,
a.button_blue.icon_mail:after,
a.button_blue.icon_mail_frontmark:before,
a.button_blue.icon_pdf:after,
a.button_blue.icon_tel:after,
a.button_blue.icon_search:after,
a.button_blue.icon_picture_zoom:after {
	color: #2494d6 !important;
}

.button_blue:hover {
	background-position: -100% 0;
	color: #2494d6 !important;
	text-decoration: none;
}

.button_blue:hover:before {
  transform: translateX(0%);
}

/*hoverしたときのボタンのときのアイコンの色*/
a.button_blue.icon_link:hover:after,
a.button_blue.icon_blank:hover:after,
a.button_blue.icon_mail:hover:after,
a.button_blue.icon_mail_frontmark:hover:before,
a.button_blue.icon_pdf:hover:after,
a.button_blue.icon_tel:hover:after,
a.button_blue.icon_search:hover:after,
a.button_blue.icon_picture_zoom:hover:after {
	color: #2494d6 !important;
}


/*左に緑丸の矢印がつくリンク*/
.icon_link_frontmark{
	display: inline-block;
	position: relative;
	padding-left: 44px;
	padding-top: 4px;
	vertical-align: middle;
	margin-top: 12px;
	margin-bottom: 12px;
	min-height: 36px;
	background: url("../img/icon_link_frontmark.svg") no-repeat left top;
	background-size: 36px 36px;
}

.icon_link_frontmark:hover {
	text-decoration: underline;
	opacity: 0.9;
}

/*右に緑丸の矢印がつくリンク*/
.icon_link_aftermark,
.contents_box a.icon_link_aftermark{
	display: block;
	position: relative;
	padding-right: 44px;
	padding-top: 4px;
	vertical-align: middle;
	margin-top: 12px;
	margin-bottom: 12px;
	min-height: 36px;
	background: url("../img/icon_link_frontmark.svg") no-repeat right top;
	background-size: 36px 36px;
	text-decoration: none;
}

.icon_link_aftermark:hover,
.contents_box a.icon_link_aftermark:hover {
	text-decoration: underline;
	opacity: 0.9;
}



.sp_only,
.sp_only {
	display:none;
}

.pc_only,
.pc_only {
}

.print_only,
.print_only {
	display:none;
}

/*PCの「p」だけマージンボトム20、スマホは0*/
.pc_only_mb20,
.pc_only_mb20 {
	margin-bottom:20px;
}









/* ---------- 要素の上下マージン ---------- */

/*p {
	margin-bottom:20px;
}*/

.mb200,
table.mb200 {
	margin-bottom:120px !important;
}

.mb180,
table.mb180 {
	margin-bottom:180px !important;
}

.mb150,
table.mb150 {
	margin-bottom:150px !important;
}

.mb120,
table.mb120 {
	margin-bottom:120px !important;
}

.mb100,
table.mb100 {
	margin-bottom:100px !important;
}

.mb90,
table.mb90 {
	margin-bottom:90px !important;
}

.mb80,
table.mb80 {
	margin-bottom:80px !important;
}

.mb70,
table.mb70 {
	margin-bottom:70px !important;
}

.mb60,
table.mb60 {
	margin-bottom:60px !important;
}

.mb50,
table.mb50 {
	margin-bottom:50px !important;
}

.mb40,
table.mb40 {
	margin-bottom:40px !important;
}

.mb30,
table.mb30 {
	margin-bottom:30px !important;
}

.mb20,
table.mb20 {
	margin-bottom:20px !important;
}

.mb15,
table.mb15  {
	margin-bottom:15px !important;
}

.mb10,
table.mb10 {
	margin-bottom:10px !important;
}

.mb5,
table.mb5 {
	margin-bottom:5px !important;
}

.mb0,
table.mb0 {
	margin-bottom:0px !important;
}

.mt0 {
	margin-top:0px !important;
}

.mt5 {
	margin-top:5px !important;
}

.mt10 {
	margin-top:10px !important;
}

.mt20 {
	margin-top:20px !important;
}

.mt30 {
	margin-top:30px !important;
}

.mt40 {
	margin-top:40px !important;
}

.mt50 {
	margin-top:50px !important;
}

.mt60 {
	margin-top:60px !important;
}

.mt70 {
	margin-top:70px !important;
}

.mt80 {
	margin-top:80px !important;
}

.mt90 {
	margin-top:90px !important;
}

.mt100 {
	margin-top:100px !important;
}

.mt-10 {
	margin-top:-10px !important;
}

.mt-20 {
	margin-top:-20px !important;
}

.mt-30 {
	margin-top:-30px !important;
}

.mt-40 {
	margin-top:-40px !important;
}

.mt-50 {
	margin-top:-50px !important;
}

.mt-60 {
	margin-top:-60px !important;
}

.mt-70 {
	margin-top:-70px !important;
}

.mt-80 {
	margin-top:-80px !important;
}

.mt-90 {
	margin-top:-90px !important;
}

.mt-100 {
	margin-top:-100px !important;
}

.pr_1rem{
	padding-right: 1rem;
}

.pr_2rem{
	padding-right: 2rem;
}

.pr_3rem{
	padding-right: 3rem;
}

.pr_4rem{
	padding-right: 4rem;
}

.pr_5rem{
	padding-right: 5rem;
}

.pr_0rem{
	padding-right: 0rem !important;
}

.pb0{
	padding-bottom: 0px !important;
}


/* --------------------
	
ページ内アンカーの飛び先

-------------------- */

.anchor{
	margin-top: -80px;
	padding-top: 80px;
}


/* --------------------
	
googleマップ、youtube動画等のiframe埋め込み

-------------------- */

/*youtube配置欄　div*/
/*※横幅を調整したい場合はこのdivに指定する*/
.youtube_box,
.mainvisual_box{
	display: block;
	position: relative;
	margin: 0 auto;
}

.youtube_box_inner,
.mainvisual_box_inner{
	display: block;
	position: relative;
	width: 100%;
	height: auto !important;
	padding-bottom: 56.25%;
	margin: 0 auto;
}

.youtube_box iframe,
.mainvisual_box iframe{
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}



/*googleマップ配置欄　div*/
.map_box{
	display: block;
	position: relative;
	width: 100%;
	height: auto !important;
	padding-bottom: 45vh;
	margin: 0 auto;
}


.map_box iframe,
.map_box object,
.map_box embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}



/*--------------------------------

トップページ専用スタイル

--------------------------------*/


/*--------------- トップページのみのスタイル（メインビジュアル） ---------------*/

/*section*/
.mainvisual_area{
	position: relative;
	padding-top: 80px;
	margin: 0 auto;
	margin-bottom: 160px;
	/*max-width: 1800px;*/
	z-index: 2;
}

/*
.mainvisual_area:after{
	content:"";
	display: block;
	position: absolute;
	left:0;
	right: 0;
	bottom: 0;
	height: 60%;
	background: url("../img/bg.png") no-repeat top 50% right;
	background-size: 40%;
	background-color: rgb(225, 221, 222);
	z-index: -1;
}
*/

.accordion-slider{
	max-height: 76vh !important;
	min-height: 400px !important;
}

.mainvisual_box{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	letter-spacing: -.40em;/* 文字間を詰めて隙間を削除する */
	position: relative;
	width: 100% !important;
	margin: 0 auto;
	z-index: 2;
	
	max-height: 76vh;
	min-height: 400px !important;
}

.main_visual_img_box1{

}

.mainvisual_catchcopy_box{
	display: inline-block;
	position: absolute;
	bottom: 100px;
	left: 120px;
	z-index: 2;
}

.mainvisual_catchcopy{
	display: inline-block;
	font-family: "Poppins", sans-serif;
	text-align: left;
	/*font-size: 3.8rem;*/
	font-size: 5.8vw;
	line-height: 1.4;
	letter-spacing: 0.1rem;
	margin-top: 0rem;
	font-weight: 700;
	color:#ffffff;
	text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
	-webkit-transition: all 0.1s ease-in-out;
	-moz-transition: all 0.1s ease-in-out;
	-o-transition: all 0.1s ease-in-out;
	transition: all 0.1s ease-in-out;
}

.mainvisual_catchcopy span{
	display: inline-block;
	border-bottom: solid 2px #ffffff;
}


/*画面幅1300px以上*/
@media (min-width: 1300px) {
	.mainvisual_catchcopy{
		font-size: 7.2rem;
	}
}

/*画面幅100px未満*/
@media (max-width: 1000px) {
	.mainvisual_catchcopy{
		font-size: 6rem;
	}
}

/*--------------- トップページ構成要素の共通パーツ ---------------*/

.frontpage_section_title_box{
	display: inline-block;
	position: relative;
	vertical-align: top;
	letter-spacing: normal;
}

.frontpage_section_title{
	display: block;
	position: relative;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 5.0rem;
	color: #FFFFFF;
	font-weight: 600;
	margin-bottom: 30px;
}



/*02お知らせ*/
.news .frontpage_section_title_box{
}




.frontpage_section_text{
	font-size: 1.8rem;
}



/*--------------- トップページの導入部分 ---------------*/

.introduction{
	display: block;
	position: relative;
	margin: 0 auto;
	margin-bottom: 100px;
	padding-left: 120px;
	padding-right: 120px;
	max-width: 1280px;
}

.mainvisual_catchcopy_english{
	display: inline-block;
	position: absolute;
	margin-top: -200px;
	top: 0;
	left: 120px;
	width: 65%;
	max-width: 860px;
	aspect-ratio: 850 / 400;/*縦横比固定*/
	background: url("../img/frontpage_introduction_title_e.svg") no-repeat left top;
	background-size: contain;
	z-index: 2;
}

.mainvisual_catchcopy_english span{
	display: none;
}

.frontpage_introduction_2column {
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	
	margin: 0 auto;
	letter-spacing: -.40em;
}

.frontpage_introduction_2column .column_inner{
	display: inline-block;
	position: relative;
	vertical-align: top;
	letter-spacing: normal;
	
}

.frontpage_introduction_2column .column_inner:nth-of-type(1){
	width: 60%;
	padding-top: 21%;
	padding-right: 5%;
	z-index: 3;
}

.frontpage_introduction_2column .column_inner:nth-of-type(2){
	width: 40%;
}

.introduction_text{
	display: block;
	position: relative;
	margin-bottom: 50px;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.8rem;
	line-height: 210%;
	font-weight: 600 !important;
	color:#333333;
}



/*--------------- トップページの「01事業案内」 ---------------*/

.service{
	display: block;
	position: relative;
	margin: 0 auto;
	padding-top: 150px;
	padding-left: 120px;
	padding-right: 120px;
	background-image: linear-gradient(90deg, #00a9ea, #006dbc);
	padding-bottom: 30px;
	border-top: solid 1px #636363;
}

.service:before{
	content:"";
	display: block;
	position: relative;
	height: 150px;
	margin: 0 auto;
	margin-left: -120px;
	margin-right: -120px;
	margin-top: -150px;
	margin-bottom: 60px;
	background: url("../img/frontpage_service_title_bg.svg") no-repeat right -38px top;
	background-size: auto 150px;
	border-bottom: solid 1px #636363;
	z-index: 1;
}

.service:after{
	content:"";
	display: block;
	position: absolute;
	width: 36px;
	height: 36px;
	top: 150px;
	left: 60px;
	background-color: #2494d7;
}

.service .section_inner{
	display: block;
	position: relative;
	margin: 0 auto;
	max-width: 1280px;
}

/*01事業案内*/
.service .frontpage_section_title_box{
	margin-bottom: 100px;
}

.service .frontpage_section_title{
	
}

.service .frontpage_section_text{
	color: #FFFFFF;
	font-weight: 600;
}

.frontpage_service_3column{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	letter-spacing: -.40em;/* 文字間を詰めて隙間を削除する */
	position: relative;
}

.frontpage_service_3column .column_inner{
	display: inline-block;
	position: relative;
	vertical-align: top;
	letter-spacing: normal;
	width: 31%;
	margin-right: 3.5%;
	margin-bottom: calc(4% + 40px);
	display: inline-block;
	position: relative;
	padding: 0px;
	background-color: #ffffff;
	border: solid 1px #636363;
	font-weight: 600;
}

.frontpage_service_3column .column_inner:nth-of-type(1n){

}

.frontpage_service_3column .column_inner:nth-of-type(2n){

}

.frontpage_service_3column .column_inner:nth-of-type(3n){
	margin-right: 0%;
}

.frontpage_service_name_e{
	display: inline-block;
	position: absolute;
	height: 40px;
	top:-40px;
	left: -1px;
	padding: 6px 12px 6px 12px;
	background-color: #ffffff;
	border: solid 1px #636363;
	font-weight: 600;
	font-size: 1.4rem;
	margin-bottom: -1px;
	z-index: -1;
}

.frontpage_service_content{
	
}

.frontpage_service_img{
	
}
.frontpage_service_name{
	padding: 15px 20px 15px 20px;
	border-bottom: dashed 1px #636363;
	font-size: 2.5rem;
}
.frontpage_service_text{
	padding: 15px 20px 15px 20px;
	line-height: 140%;
	font-weight: normal;
}

.frontpage_service_link{
	height: 100%;
}

.frontpage_service_link a{
	display: flex; /* 子要素をflexboxで揃える */
	flex-direction: column; /* 子要素をflexboxにより縦並びに揃える */
	justify-content: center; /* 子要素をflexboxにより左右中央に配置する */
	align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
	color: #ffffff;
	background-color: #333333;
	height: 100%;
	padding: 20px;
	font-size: 2rem;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.frontpage_service_link a:after{
	content:"";
	display: block;
	position: relative;
	width: 80px;
	height: 80px;
	background: url("../img/frontpage_service_icon_link.svg") no-repeat center center;
	background-size: contain;
	margin: 0 auto;
	margin-top: 20px;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.frontpage_service_link a:hover{
	background-color: #494949;
}

.frontpage_service_link a:hover:after{
	width: 84px;
	height: 84px;
}



/*--------------- トップページの「02NEWS」 ---------------*/

.news{
	display: block;
	position: relative;
	margin: 0 auto;
	padding: 120px 60px 0px 60px;
	margin-bottom: 120px;
}

.news:before{
	content:"";
	display: block;
	position: relative;
	margin: 0 auto;
	margin-left: -60px;
	margin-right: -60px;
	background-size: auto 150px;
	border-bottom: solid 1px #636363;
	z-index: 1;
}

.news:after{
	content:"";
	display: block;
	position: relative;
	margin: 0 auto;
	margin-left: -60px;
	margin-right: -60px;
	background-size: auto 150px;
	border-bottom: solid 1px #636363;
	z-index: 1;
}

.blue_cube:after{
	content:"";
	display: block;
	position: absolute;
	width: 36px;
	height: 36px;
	top: 120px;
	left: 60px;
	background-color: #2494d7;
}

.news .section_inner{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	
	letter-spacing: -.40em;
	margin: 0 auto;
	max-width: calc(1280px + 70px + 70px);
}

.news .section_inner .title_box {
	display: inline-block;
	position: relative;
	vertical-align: top;
	letter-spacing: normal;
	width: 265px;
}

.news .section_title{
	display: inline-block;
	position: relative;
	vertical-align: top;
	letter-spacing: normal;
	padding:23px 25px 23px 60px;
	font-family: "dnp-shuei-mgothic-std", sans-serif;/*ウェイトは400、600*/
	font-size: 1.6rem;
	font-weight: 400;
	margin-bottom: 0px;
	width: 260px;
	max-height: 100px;
}

.news .section_title img{
	height: 54px;
	width: auto;
}

.news .section_title span{
	display: none;
}

.news .section_inner .news_list_box{
	display: inline-block;
	position: relative;
	vertical-align: top;
	letter-spacing: normal;
	width: calc(100% - 265px);
	
	
}

/*お知らせ1記事分 div*/
.news_1box{
	display:block;
	position:relative;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	border-top:solid 1px #d3d3cf;
	overflow: hidden;
	z-index: 1;
}

.news_1box:first-Child{
	border-top:solid 0px #d3d3cf;
}

/*1記事毎のくくりに「no_icon」が付いている場合はQとAのアイコンをつけない*/
.news_1box.no_icon{
	padding-left: 0px;
}

/* 「記事タイトル欄」の設定 */
.news_title_box{
	display:block;
	position: relative;
	width: 100%;
	cursor: pointer;
	
	
}

/*お知らせタイトルのクリック範囲*/
.news_click_area{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	position:relative;
	box-sizing:border-box;
	width:100%;
	min-height: 100px;
	margin:0px 0px 0px 0px;
	padding:14px 5% 14px 5%;
	align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.news_click_area:hover{
	cursor: pointer;
	background-color: #f2f2f2;
}

.news_click_area.active:hover{
	cursor: pointer;

}

.news_click_area p{
	text-align:left;
	line-height: 160%;
}

.news_click_area:hover p{
}

.news_click_area.active p{

}

.news_title_box .date{
	display: inline-block;
	position: relative;
	font-size: 16px;
	color: #2594d7;
	font-weight: 600;
	margin-right: 6px;
	margin-bottom: 5px;
	vertical-align: middle;
	line-height: 100%;
	min-width: 80px;
	width: 100%;
	letter-spacing: normal;
}

.news_title_box .genre{
	display: inline-block;
	position: relative;
	padding: 1px 5px 1px 5px;
	border: solid 1px #555555;
	font-size: 1.1rem;
	color: #555555;
	margin-right: 3px;
	text-align: center;
	min-width: 70px;
	letter-spacing: normal;
}

.genre_01,
.genre_02,
.genre_03,
.genre_04,
.genre_05,
.genre_06,
.genre_07,
.genre_08,
.genre_09,
.genre_10{
	
}

/*
初期ジャンル
・お知らせ　　　　　
・ブログ　　　　
・事例紹介
・採用情報
*/

/*お知らせ*/
.genre_01{}

/*ブログ*/
.genre_02{}

/*事例紹介*/
.genre_03{}

/*採用情報*/
.genre_04{}

/*予備*/
.genre_05{}

/*予備*/
.genre_06{}

/*予備*/
.genre_07{}

/*予備*/
.genre_08{}

/*予備*/
.genre_09{}

/*予備*/
.genre_10{}


.news_title_box .title{
	display: block;
	width: 100%;
	position: relative;
	font-size: 1.8rem;
	font-weight: 500;
	color: #333333;
	vertical-align: middle;
	line-height: 160%;
	letter-spacing: normal;
	padding-right: 40px;
}

.news_title_box .title.icon_new:after{
	content:"NEW";
	display: inline-block;
	position: relative;
	font-size: 10px;
	color: #ffffff;
	margin-left: 6px;
	margin-top: -2px;
	vertical-align: middle;
	/**/
	background-color: #333333;
	line-height: 100%;
	padding: 2px 2px 2px 2px;
}

.news_title_box .title a:hover{
	text-decoration: underline;
}

/* 答えのエリア div */
.news_contents_box{
	display: none;
	position: relative;
	width:100%;
	margin:0px 0px 14px 0px;
	padding:4px 5% 14px 5%;
	
	opacity: 1;
	animation: answer_triangle_fade 0.5s linear;
	-webkit-animation: answer_triangle_fade 0.5s linear;
	-moz-animation: answer_triangle_fade 0.5s linear;
}

/*NEWS、FAQ共通利用*/
.accordion_icon,
.accordion_icon span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
	pointer-events: none;
	z-index: 2;
}
.accordion_icon {
	position: absolute;
	right:3%;
	top:calc(50px - 20px);
	width: 40px;
	height: 40px;
	background: url("../img/icon_down.svg") no-repeat center center;
	background-size: contain;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}


/*開閉アイコン切り替え*/

.accordion_icon.active {
	transform: rotate(180deg);
}

.accordion_icon.active span:nth-of-type(1) {
	width: 50%;
	top: 11px;
	left: 6px;
	
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
}

.accordion_icon.active span:nth-of-type(2) {
	width: 50%;
	top: 11px;
	right: 6px;
	
	transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	-ms-transform: rotate(135deg);
	-o-transform: rotate(135deg);
}



/*--------------- トップページの「03施工事例」 ---------------*/

.ex{
	display: block;
	position: relative;
	margin: 0 auto;
	background: url("../img/frontpage_ex_bg.jpg") no-repeat center top;
	background-size: cover;
	padding-top: 100px;
	padding-bottom: 140px;
}

.ex_title_e_box{
	display: inline-block;
	position: relative;
	height: 160px;
	border-top: solid 1px color(display-p3 0.318 0.49 0.639);
	border-bottom: solid 1px color(display-p3 0.318 0.49 0.639);
	margin-bottom: 60px;
}

/*ul*/
.ex_title_infiniteslide{
	
}

.ex_title_infiniteslide li img{
	margin-right: 100px;
	height: 158px;
}

.ex .section_inner{
	display: block;
	position: relative;
	margin: 0 auto;
	padding-left: 120px;
	padding-right: 120px;
	max-width: 1520px;
}

.ex_title_e_box:after{
	content:"";
	display: block;
	position: absolute;
	width: 36px;
	height: 36px;
	bottom: -37px;
	left: 60px;
	background-color: rgba(36, 148, 215, 0.7);
}

/*03施工事例*/
.ex .frontpage_section_title_box{
	margin-bottom: 80px;
}

.ex .frontpage_section_title{
	
}

.ex .frontpage_section_text{
	color: #FFFFFF;
	font-weight: 600;
}

.ex_photo_box{
	margin-bottom: 60px;
}

/*ul*/
.ex_photo_infiniteslide{
	
}



/*div*/
.ex_link_box{
	margin: 0 auto;
	max-width: 1280px;
	text-align: center;
}

/*p*/
.ex_link{
	display: inline-block;
	position: relative;
}

.ex_link a{
	display: inline-block;
	position: relative;
	width: 100%;
	padding: 20px 70px 20px 70px;
	border: solid 1px #ffffff;
	font-weight: 600;
	font-size: 1.9rem;
	color: #ffffff;
	min-width: 300px;
	width: 36vw;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.ex_link a:after{
	content:"";
	display: inline-block;
	position: absolute;
	width: 28px;
	height: 28px;
	top:calc(50% - 14px);
	right: 20px;
	background: url("../img/icon_link_white.svg") no-repeat center center;
	background-size: contain;
}

.ex_link a:hover{
	background-color: rgba(35, 148, 216, 1);
}
	



/*--------------- トップページの「04会社概要」 ---------------*/

.company{
	display: block;
	position: relative;
	margin: 0 auto;
	padding: 120px 60px 0px 60px;
	margin-bottom: 100px;
	min-height: 600px;
}

.company:before{
	content:"";
	display: block;
	position: relative;
	margin: 0 auto;
	margin-left: -60px;
	margin-right: -60px;
	background-size: auto 150px;
	border-bottom: solid 1px #636363;
	z-index: 1;
}

.company:after{
	content:"";
	display: block;
	position: absolute;
	bottom: 0px;
	right: 61px;
	width: 54%;
	aspect-ratio: 900 / 160;/*縦横比固定*/
	background: url("../img/frontpage_company_bg_wataru.svg") no-repeat right bottom;
	background-size: contain;
	max-width: 800px;
}

.blue_cube:after{
	content:"";
	display: block;
	position: absolute;
	width: 36px;
	height: 36px;
	top: 120px;
	left: 60px;
	background-color: #2494d7;
}

/*03会社概要*/
.company .title_box{
	display: block;
	position: relative;
	vertical-align: top;
	letter-spacing: normal;
	margin-bottom: 20px;
}

.company .title_box:after{
	content:"";
	display: block;
	position: relative;
	margin: 0 auto;
	margin-left: -60px;
	margin-right: -60px;
	background-size: auto 150px;
	border-bottom: solid 1px #636363;
	z-index: 1;
}

.company .title_box .title_box_inner{
	display: block;
	position: relative;
	margin: 0 auto;
	max-width: calc(1280px + 70px + 70px);
}

.company .section_title{
	display: inline-block;
	position: relative;
	vertical-align: top;
	letter-spacing: normal;
	padding:23px 25px 23px 60px;
	font-family: "dnp-shuei-mgothic-std", sans-serif;/*ウェイトは400、600*/
	font-size: 1.6rem;
	font-weight: 400;
	margin-bottom: 0px;
	max-height: 100px;
}

.company .section_title img{
	height: 54px;
	width: auto;
}

.company .section_title span{
	display: none;
}

.frontpage_section_title_company{
	font-size: 2.2rem;
	margin-bottom: 60px;
}

.company .section_inner{
	display:block;
	position: relative;
	margin: 0 auto;
	padding-left: 60px;
	padding-right: 60px;
	max-width: calc(1280px + 60px + 60px);
}

.frontpage_company_2column{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	letter-spacing: -.40em;
	margin: 0 auto;
	margin-bottom: 80px;
	z-index: 1;
}

.frontpage_company_2column .column_inner{
	display: inline-block;
	position: relative;
	vertical-align: top;
	letter-spacing: normal;
	width: 70%;
	padding-right: 5%;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.frontpage_company_2column .column_inner:nth-of-type(2){
	margin-top: -60px;
	width: 30%;
	padding-right: 0%;
}

.company .frontpage_catchcopy{
	font-size: 3.6rem;
	font-weight: 700;
	margin-bottom: 30px;
}

.frontpage_company_text{
	font-size: 1.8rem;
	margin-bottom: 80px;
}

.frontpage_company_link{
	
}

.frontpage_company_link a{
	padding-right: 60px;
	min-width: 280px;
	width: 24vw;
}

.frontpage_company_link a:after{
	
}

.frontpage_company_link a:after{
	content:"";
	display: inline-block;
	position: absolute;
	width: 28px;
	height: 28px;
	top:calc(50% - 14px);
	right: 20px;
	background: url("../img/icon_link_white.svg") no-repeat center center;
	background-size: contain;
}

.frontpage_company_link a:hover:after{
	content:"";
	display: inline-block;
	position: absolute;
	width: 28px;
	height: 28px;
	top:calc(50% - 14px);
	right: 20px;
	background: url("../img/icon_link_black.svg") no-repeat center center;
	background-size: contain;
}

.frontpage_company_img{
	max-width: 210px;
	margin: 0 auto;
	text-align: center;
}

.frontpage_company_img img{
	width: 100%;
}


/*--------------------------------

iOSでの「100vh」が正確じゃない問題の解決

--------------------------------*/

/* Safari用のハックは、Chromeに適用されないようにする */

@supports (-webkit-touch-callout: none) {
	.drawermenu_box,
	.mainvisual_area,
	#mainvisual_box,
	.mainvisual,
	.mainvisual_catchcopy_box{
	/* Safari用のハック */
	/*height: -webkit-fill-available;*/
  }
}





/*--------------------------------

下層ページ共通部分

--------------------------------*/

/*ページタイトル基本形*/
.page_title_box{
	display: block;
	position: relative;
	text-align: left;
	margin: 0 auto;
	margin-top: 160px;
	padding: 0px 60px 80px 60px;
	border-top: solid 1px #636363;
}

.page_title_box:after{
	content:"";
	display: block;
	position: absolute;
	width: 36px;
	height: 36px;
	top: 0px;
	left: 60px;
	background-color: #2494d7;
}

.page_title_inner{
	
}

/*ページタイトル 英語*/
.page_title_box .title_english {
	display: inline-block;
	position: relative;
	width: 100%;
	height: 104px;
	padding: 25px 25px 25px 70px;
	border-bottom: solid 1px #636363;
	margin-bottom: 10px;
}

.page_title_box .title_english span{
	display: none;
}

.category_service .page_title_box .title_english {
	background: url("../img/title_service.svg") no-repeat left 60px center;
	background-size: auto 54px;
}

.category_company .page_title_box .title_english {
	background: url("../img/title_company.svg") no-repeat left 60px center;
	background-size: auto 54px;
}

.category_ex .page_title_box .title_english {
	background: url("../img/title_example.svg") no-repeat left 60px center;
	background-size: auto 54px;
}

.category_contact .page_title_box .title_english {
	background: url("../img/title_contact.svg") no-repeat left 60px center;
	background-size: auto 54px;
}

/*ページタイトル 日本語*/
.page_title_box .page_title{
	display: block;
	position: relative;
	padding-left: 60px;
	font-size: 2.4rem;
	font-weight: 600;
	line-height: 140%;
}

.page_title_box .title_text {
}

.contents_all{
	display: block;
	position: relative;
	padding: 0px 120px 0px 120px;
	margin: 0 auto;
	
}

.section_inner{
	display: block;
	position: relative;
	margin: 0 auto;
	max-width: 1200px;
}

/*段落ごとのくくり*/
.content_box{
	display: block;
	position: relative;
	margin: 0 auto;
	margin-bottom: 100px;
}

.content_box h3{
	color: #000000;
	font-size: 3.2rem;
	margin-bottom: 30px;
	font-weight: 700;
	/*-webkit-text-stroke-width: 1px;*/
}

/*段落のタイトル　日本語プラス英語の、罫線があるテンプレート*/
.section_title_box{
	display: flex;
	position: relative;
	justify-content: flex-start; /*左寄せ（デフォルト）*/
	align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
	margin-left: calc(-1 * ((100vw - 1200px) / 2 ) + 60px);
	margin-right: calc(-1 * ((100vw - 1200px) / 2 ) + 60px);
	margin-bottom: 80px;
	border-top: solid 1px #636363;
	border-bottom: solid 1px #636363;
}

/*画面幅1440未満*/
@media (max-width: 1440px) {
	.section_title_box{
		margin-left: -60px;
		margin-right:  -60px;
	}
}

.content_box h3.section_title{
	display: inline-block;
	position: relative;
	padding: 25px 50px 30px 60px;
	margin-bottom: 0px;
	font-size: 3.8rem;
	font-weight: 500;
	line-height: 100%;
	border-right: solid 1px #636363;
	-webkit-text-stroke-width: 0px;
}

.section_title_e{
	position: relative;
	color: #000000;
	font-size: 2.8rem;
	font-weight: 500;
	padding-left: 40px;
	line-height: 100%;
}

.section_title_e:before{
	content:"";
	display: block;
	position: absolute;
	width: 23px;
	height: 23px;
	top: calc(50% - 12px);
	left: calc(0px - 12px);
	background-color: #2494d7;
}


/*--------------------------------

「事業案内」ページ　ディレクトリ：service/

--------------------------------*/

.category_service{
	
}

.entry_service{
	
}

.entry_service .main_img_box{
	display: block;
	position: relative;
	margin: 0 auto;
	margin-bottom: 100px;
}

/*ワタルが選ばれる理由タイトル*/
.service_reason_title_box{
	display: flex;
	position: relative;
	align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
	background-color: #2391D2;
	padding: 20px 60px 20px 60px;
	margin-left: calc(-1 * ((100vw - 1200px) / 2 ) + 60px);
	margin-right: calc(-1 * ((100vw - 1200px) / 2 ) + 60px);
	margin-bottom: 60px;
	border-top: solid 1px #636363;
	border-bottom: solid 1px #636363;
}

/*画面幅1440未満*/
@media (max-width: 1440px) {
	.service_reason_title_box{
		margin-left: -60px;
		margin-right:  -60px;
	}
}

.content_box h3.service_reason_title{
	display: inline-block;
	position: relative;
	width: 100%;
	margin: 0 auto;
	max-width: 1200px;
	color: #ffffff;
	font-weight: 700;
	font-size: 4.8rem;
	text-align: left;
	-webkit-text-stroke-width: 1px;/*太字*/
}

.service_reason_3column{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	letter-spacing: -.40em;/* 文字間を詰めて隙間を削除する */
	position: relative;
}

.service_reason_3column .column_inner{
	display: inline-block;
	position: relative;
	vertical-align: top;
	letter-spacing: normal;
	width: 31%;
	margin-right: 3.5%;
	border: solid 1px #636363;
}

.service_reason_3column .column_inner:nth-of-type(3n){
	margin-right: 0%;
}

.service_reason_img{
	border-bottom: solid 1px #636363;
}

.service_reason_catchcopy{
	padding: 20px 30px 20px 30px;
	font-size: 3.0rem;
	font-weight: 700;
	color: #2391D2;
	line-height: 130%;
	border-bottom: solid 1px #636363;
}

/*画面幅1320未満*/
@media (max-width: 1320px) {
	.service_reason_catchcopy br{
		display: none;
	}
}

.service_reason_text{
	padding: 20px 30px 20px 30px;
	font-size: 1.7rem;
}

/*事業紹介*/
.service_about_1box{
	margin-bottom: 40px;
}

.service_about_column_box{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	letter-spacing: -.40em;/* 文字間を詰めて隙間を削除する */
	position: relative;
	border: solid 1px #636363;
}

.service_about_column_box .column_inner{
	display: inline-block;
	position: relative;
	vertical-align: top;
	letter-spacing: normal;
	width: 68%;
	margin-right: 0%;
}

.service_about_title_box{
	display: flex; /* 子要素をflexboxで揃える */
	align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
	border-bottom: solid 1px #636363;
}

.service_about_title{
	padding: 22px 30px 22px 30px;
	border-right: solid 1px #636363;
	font-size: 3.0rem;
	font-weight: 600;
	line-height: 130%;
}

.service_about_title_e{
	padding: 22px 30px 22px 30px;
	font-size: 1.9rem;
	font-weight: 600;
	line-height: 130%;
}

.service_about_tag_box{
	border-bottom: solid 1px #636363;
}

.service_about_tag_box ul{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
	padding: 22px 30px 17px 30px;
}

.service_about_tag_box ul li{
	font-size: 1.5rem;
	background-color: #333333;
	color: #ffffff;
	padding: 4px 10px 4px 10px;
	margin-right: 5px;
	margin-bottom: 5px;
}

.service_about_text_box{
	display: flex; /* 子要素をflexboxで揃える */
	align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
	padding: 25px 30px 25px 30px;
}

.service_about_text{
	
}

.service_about_column_box .column_inner:nth-of-type(2){
	display: flex; /* 子要素をflexboxで揃える */
	flex-direction: column; /* 子要素をflexboxにより縦並びに揃える */
	justify-content: center; /* 子要素をflexboxにより左右中央に配置する */
	align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
	width: 32%;
	margin-right: 0%;
}

.service_about_img{
	width: 100%;
	height: 100%;
	border-left: solid 1px #636363;
}

.service_about_img img{
	width:100%;
	height: 100%;
	object-fit: cover; /* この一行を追加するだけ！ */
}

/*--------------------------------

「会社概要」ページ　ディレクトリ：company/

--------------------------------*/

.category_company{
	
}

.entry_company{
	
}

.entry_company .main_img_box{
	display: block;
	position: relative;
	margin: 0 auto;
	margin-bottom: 100px;
}



/*--------------------------------

「施工事例」ページ　ディレクトリ：ex/

--------------------------------*/

.category_ex{
	
}

.entry_ex{
	
}

.ex_column{
	display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
	letter-spacing: -.40em;
	font-size: 0px;
	border-top: solid 5px #282828;
	border-bottom: solid 5px #282828;
}

.ex_column .column_inner{
	display: inline-block;
	position: relative;
	vertical-align: top;
	letter-spacing: normal;
	width: 33.333333%;
	aspect-ratio: 1 / 1;/*縦横比固定*/
	border-right: dotted 1px #282828;
	border-bottom: dotted 1px #282828;
	
	cursor: zoom-in;
}

.ex_column .column_inner:nth-of-type(3n) {
	border-right: dotted 0px #282828;
}

/*p*/
.ex_name{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	padding: 12px 25px 12px 25px;
	color: #282828;
	font-size: 1.65rem;
	font-weight: 600;
	line-height: 1.3;
	z-index: 1;
	background-color: rgba(255, 255, 255, 0.5);
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.ex_column .column_inner:hover .ex_name{
	color: #ffffff;
	background-color: rgba(0,0,0, 0.2)
}

.ex_column .column_inner a{
	display: flex;
	position: absolute;
	top: 0%;
	left: 0%;
	right: 0%;
	bottom: 0%;
	
	cursor: zoom-in;
}

.ex_photo{
	display: flex;
	position: absolute;
	
	flex-direction: column; /* 子要素をflexboxにより縦並びに揃える */
	justify-content: center; /* 子要素をflexboxにより左右中央に配置する */
	align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
	top: 0%;
	left: 0%;
	right: 0%;
	bottom: 0%;
	
	
}

.ex_column .column_inner .ex_photo img{
	display: flex;
	position: relative;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ex_column .column_inner a:hover .ex_photo img{
	opacity: 1;
}

.ex_photo:after{
	content:"";
	display: flex;
	position: absolute;
	top: 0%;
	left: 0%;
	right: 0%;
	bottom: 0%;
	border-top: solid 46px #ffffff;
	border-left: solid 46px #ffffff;
	border-right: solid 46px #ffffff;
	border-bottom: solid 54px #ffffff;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

.ex_column .column_inner:hover .ex_photo:after{
	border: solid 0px #ffffff;
}


/*ズーム画像の虫眼鏡アイコン*/
.icon_zoom{
	display: block;
	position: relative;
	cursor: zoom-in;
}

/**/
.icon_zoom:after {
	content:"";
	font-family: "Material Symbols Outlined";
	content: "\e8ff";
	display: flex; /* 子要素をflexboxで揃える */
	flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
	justify-content: center; /* 子要素をflexboxにより中央に配置する */
	align-items: center;
	position: absolute;
	right: 10px;
	bottom: 10px;
	width: 36px;
	height: 36px;
	font-size: 24px;
	font-weight: 400;
	vertical-align: middle;
	line-height: normal;
	color: #666666;
	border: solid 0px #ffffff;
	background-color: rgba(255, 255, 255, 0.5);
	
	border-radius: 36px;
	-webkit-border-radius: 36px;
	-ms-border-radius: 36px;
	-moz-border-radius: 36px;
	-o-border-radius: 36px;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

a.icon_zoom:hover:after {
	right: 8px;
	bottom: 8px;
	width: 40px;
	height: 40px;
	
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

/*ul*/
.ex_tag_list{
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 12px 25px 12px 25px;
	
	
	z-index: 1;
}

.ex_tag_list li{
	display: inline-block;
	position: relative;
	margin-right: 3px;
	padding: 2px 5px 2px 5px;
	border: dotted 1px #767676;
	background-color: rgba(255, 255, 255, 0.9);
	font-size: 1.3rem;
	color: #767676;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
}

.ex_tag_list li:before{
	content:"#";
}

.ex_column .column_inner:hover .ex_tag_list{
	color: #ffffff;
}

	
/*--------------------------------

「お問い合わせ」ページ　ディレクトリ：contact/

--------------------------------*/

/*--------------- 「お問い合わせ」 ---------------*/

.contact{
	display: block;
	position: relative;
	margin: 0 auto;
	padding: 60px 0 60px 0;
}

.contact .section_inner{
	display: block;
	position: relative;
	padding-left: 80px;
	padding-right: 80px;
}

.contact .section_inner .title_box{
	display: block;
	position: relative;
	max-width: 1400px;
	margin: 0 auto;
	margin-bottom: 30px;
	
}

.contact .section_inner .title_box .title_english{
	margin-right: 2.5rem;
}

.contact_content_box,
.category_contact .content_box{
	margin: 0 auto;
	max-width: 1080px;
}

/*トップページのお問い合わせ欄*/
.contact_content_box{
	margin-bottom: 30px;
}

/*お問い合わせページのみ*/
.category_contact .content_box{
	margin-bottom: 150px;
}

/*フォームのtableを囲んだdiv*/
.form_table_box{
	display: block;
	position: relative;
	margin: 0 auto;
	width: 100%;
	margin-bottom: 40px;
}

/*フォームのtable*/
.form_table_box table{
	border-top: #c5bebe solid 0px;
	border-left: #c5bebe solid 0px;
	width: 100%;
}

.form_table_box table tr {
	border-bottom: #c5bebe solid 0px;
	border-right: #c5bebe solid 0px;
	font-size: 100%;
}

.form_table_box table th {
	padding: 15px 4vw 15px 0px;
	border-bottom: #c5bebe dotted 0px;
	border-right: #c5bebe solid 0px;
	font-size: 100%;
	width: 38%;
}

.form_table_box table tr td {
	padding: 15px 0px 15px 0px;
	border-bottom: #c5bebe dotted 0px;
	border-right: #c5bebe solid 0px;
	font-size: 100%;
}

.category_contact .form_table_box table th,
.category_contact .form_table_box table tr td {
	display: inline-block;
}

.form_table_box table tr td:first-of-type {
	width: 30%;
}

/*確認ページのテーブルのみ*/
.form_table_box.check_table table tr {
	border-bottom: #c5bebe dotted 1px;
}

.form_table_box.check_table table th {
	padding-right:5%;
	width: 45%;
}

.form_table_box.check_table table td {
	font-size: 110%;
}


/* テキストボックス本体 */
.form_table_box table td input[type="text"],
.form_table_box table td input[type="email"] {
	width: 100%;
	padding: 12px 12px 12px 12px !important;
	font-size: 18px;
	border: #c5bebe solid 1px;
	
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}


.form_table_box table td span.age input[type="text"]{
	width: 4em;
}

.form_table_box table td span.zip-code input[type="text"],
.form_table_box table td span.area input[type="text"],
.form_table_box table td span.shop_name input[type="text"]{
	width: 12em;
}



/*テキストエリア*/
.form_table_box table td textarea{
	width: 100%;
	padding: 12px 12px 12px 12px;
	font-size: 16px;
	border:solid 1px #c5bebe;
	
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}



/*プルダウン欄　div*/
.form_table_box select {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	border-radius: 0;
	border: 0;
	margin: 0;
	padding: 0;
	background: none transparent;
	vertical-align: middle;
	font-size: inherit;
	color: inherit;
	box-sizing: content-box;
	cursor: pointer;
	width: auto;
	padding: 12px 12px 12px 12px;
	background: #efefef;
	color: #555555;
	font-size: 14px;
	line-height: 1;
	transition: .2s;
	border: #d8d8d8 solid 1px;
	border-radius: 8px 8px 8px 8px;
	
	font-size: 18px;
	border: #d8d8d8 solid 1px;
	border-radius:		8px;
}



/*チェックボックスにstyleをつけるために、チェックボックスと確認ボタンをくくったdivに付加*/
.chkbox_box,
.radio_box {
	margin:0px 0px 0px 0px;
	padding: 8px 0px 0px 0px;
}

/* ラベルのスタイル　*/
.chkbox_box label,
.radio_box label {
	padding-left:		34px;
	font-size:		18px;
	line-height:		18px;
	display:		inline-block;
	cursor:			pointer;
	position:		relative;
	margin-bottom: 1.4rem;
}

/* チェックボックスのスタイル */
.chkbox_box label:before {
	content:		'';
	width:			20px;			/* ボックスの横幅 */
	height:			20px;			/* ボックスの縦幅 */
	display:		inline-block;
	position:		absolute;
	top:-4px;
	left:			0;
	background-color:	#fff;
	/*box-shadow:		inset 1px 2px 3px 0px #000;*/
	border: 2px solid #dcdcdc;
	border-radius:		3px;
}

/* ラジオボタンのスタイル */
.radio_box label:before {
	content:		'';
	width:			20px;			/* ボックスの横幅 */
	height:			20px;			/* ボックスの縦幅 */
	display:		inline-block;
	position:		absolute;
	top:-4px;
	left:			0;
	background-color:	#fff;
	/*box-shadow:		inset 1px 2px 3px 0px #000;*/
	border: 2px solid #dcdcdc;
	border-radius:		24px;
}

/* 元のチェックボックスを表示しない */
.chkbox_box input[type=checkbox],
.radio_box input[type=radio] {
	display:		none;
}

/* チェックした時のスタイル */
.chkbox_box input[type=checkbox]:checked + label:before{
	content:		'';		/* チェックの文字 */ 
	font-size:		16px;			/* チェックのサイズ */
	color:			#fff;			/* チェックの色 */
	background-color:	rgb(106, 180, 47);			/* チェックした時の色 */
	border: 2px solid rgb(106, 180, 47);
	-webkit-animation: form-bound .3s ease 0s 1;
	animation: form-bound .3s ease 0s 1;
	opacity: 1;
}

.chkbox_box input[type=checkbox]:checked + label:after{
	content:		'✓';
	color: #ffffff;
	position: absolute;
	top:-1px;
	left: 4px;
	font-size: 22px;
	transform: scale(1.0, 0.8);

	opacity: 1;
}


.radio_box input[type=radio]:checked + label:before {
	content:		'';		/* チェックの文字 */ 
	font-size:		16px;			/* チェックのサイズ */
	color:			#fff;			/* チェックの色 */
	background-color:	rgb(106, 180, 47);			/* チェックした時の色 */
	border: 2px solid rgb(106, 180, 47);
	
	-webkit-animation: form-bound .3s ease 0s 1;
	animation: form-bound .2s ease 0s 1;
	opacity: 1;
}

.radio_box input[type=radio]:checked + label:after {
	content:		'';
	width:			10px;			/* ボックスの横幅 */
	height:			10px;			/* ボックスの縦幅 */
	display:		inline-block;
	position:		absolute;
	top:-1px;
	left:3px;
	/*box-shadow:		inset 1px 2px 3px 0px #000;*/
	border: 4px solid #FFFFFF;
	border-radius:		24px;
	
	-webkit-animation: form-bound .3s ease 0s 1;
	animation: form-bound .2s ease 0s 1;
	opacity: 1;
}

@-webkit-keyframes form-bound {
	0% {
		-webkit-transform: scale(1);
		transform:scale(1)
	}

	25% {
		-webkit-transform: scale(1.15);
		transform:scale(1.15)
	}

	75% {
		-webkit-transform: scale(0.95);
		transform:scale(0.95)
	}

	100% {
		-webkit-transform: scale(1);
		transform:scale(1)
	}
}

@keyframes form-bound {
	0% {
		-webkit-transform: scale(1);
		transform:scale(1)
	}

	25% {
		-webkit-transform: scale(1.15);
		transform:scale(1.15)
	}

	75% {
		-webkit-transform: scale(0.95);
		transform:scale(0.95)
	}

	100% {
		-webkit-transform: scale(1);
		transform:scale(1)
	}
}





input.inline{
	display: inline-block;
	width: auto !important;
}



/*記入例　span*/
.form_table_box .ex_text{
	display: inline-block;
	margin-top: 4px;
	padding: 4px 4px 4px 4px;
	font-size: 90%;
	color: #666;
}

/*必須　span*/
.form_table_box .required{
	font-size: 86%;
	color:#ff3333;
}


.item_subtitle{
	display: inline-block;
	text-align: center;
	vertical-align: text-top ;
	padding: 4px 4px 4px 4px;
	margin-top: 0px;
	line-height: 100% !important;
	background-color: #b7c833;
	letter-spacing: 0.05rem;
	min-width: 70px;
	margin-right: 10px;
	font-size: 1.1rem;
	color: #FFFFFF;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}


/*未記入の入力欄 span*/
.form_table_box th span.errwrap {
	/*
	color: #ff3333;
	font-weight: 600;
	*/
}

/*未記入の項目名 span*/
.form_table_box td span.errwrap{
	/*
	display: inline-block;
	overflow: hidden;
	padding: 0;
	border: 5px solid #ffcccc;
	background: #ffcccc;
	width: 100%;
	*/
}

.form_table_box td span.errwrap:after{
	content:"";
	display: block;
	position: relative;
	width: 100%;
	height: 0px;
	clear: both;
	float: none;
}


/*box_grayと併用してスクロールを追加　div*/
.scroll_box{
	width: auto;
	overflow-y:scroll;
	overflow-x:hidden;
	height: 220px;
}






/*確認、戻る、送信ボタン等を格納したdiv*/
.form_submit_btn_box{
	margin: 0 auto;
	text-align: center;
	margin-top: 30px;
	margin-bottom: 30px;
}

/*確認と送信ボタン（濃いグレー）*/
.button_to_check,
.button_send {
	display: inline-block;
	position: relative;
	text-align: center;
	font-size: 1.7rem;
	font-weight: 600;
	line-height: 130%;
	background-color: #2494d7;
	color: #ffffff;
	border: solid 1px #2494d7;
	padding: 14px 2vw 14px 2vw;
	min-width: 200px;
	text-decoration: none;
	margin-top: 6px;
	margin-bottom: 6px;
	margin-left: 3px;
	margin-right: 3px;
	
	z-index: 1;
		
	overflow: hidden;
	transition: .3s;
}

.button_to_check:hover,
.button_send:hover {
	opacity: 0.8;
	text-decoration: none;
}


/*ボタン（グレー）*/
.button_to_back {
	display: inline-block;
	position: relative;
	text-align: center;
	font-size: 1.7rem;
	font-weight: 600;
	line-height: 130%;
	color: #444444;
	border: solid 1px #9a9a9a !important;
	background-color: #ffffff;
	padding: 14px 2vw 14px 2vw;
	min-width: 200px;
	text-decoration: none;
	margin-top: 6px;
	margin-bottom: 6px;
	
	z-index: 1;
		
	overflow: hidden;
	transition: .3s;
	


}

.button_to_back:hover{
	text-decoration: none;
	border: solid 1px #dfdfdf !important;
	background-color: rgb(241, 241, 241) !important;
}


.contact_check_text{
	text-align: center;
}

/*box_grayと併用してスクロールを追加　div*/
.scroll_box{
	width: 100%;
	max-width: 1080px;
	height: 200px;
	margin-bottom: 50px;
	overflow-y:scroll;
	overflow-x:hidden;

}

.content_box .scroll_box h3{
	font-size: 2.2rem;
}

.content_box .scroll_box h4{
	font-size: 1.8rem;
}

.contact_finish_box{
	max-width: 1080px;
}


/*--------------------------------

「お知らせ」ページ　ディレクトリ：news　※独立ページとして設置するかどうか未定

--------------------------------*/


.category_news .content_box{
	max-width: 740px;
}

.category_news .section_inner .content_box:first-of-type{
}


.news_list_box{
	display: block;
	position: relative;
	margin: 0 auto;
	
}

/*記事一覧　ul*/

.category_news .news_list_box .news_list {
	display: block;
	position: relative;
	margin: 0 auto;
	margin-bottom: 50px;
	/*border-top: solid 1px #cdcdcd;*/
}

.category_news .news_list {
	display: -webkit-box;
	display: -moz-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	letter-spacing: -.40em;
	/*border-top: dotted 1px #cdcdcd;*/
	padding-top: 20px;
}

.category_news .news_list li {
	display: -webkit-box;
	display: -moz-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	letter-spacing: -.40em;
	vertical-align: top;
	width: 100%;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-left: 2vw;
	padding-right: 2vw;
	border-bottom: solid 1px #cdcdcd;
}

.category_news .news_list li:nth-of-type(1) {
	border-top: solid 1px #cdcdcd;
}

.category_news .news_title_box {
	display: inline-block;
	position: relative;
	width: 100%;
	letter-spacing: normal;
}

.category_news .news_title_box .date {
	display: block;
	position: relative;
	font-size: 1.3rem;
	color: #666666;
	/*margin-right: 6px;*/
	vertical-align: middle;
	line-height: 100%;
	/*min-width: 76px;*/
	margin-top: 8px;
}

.category_news .news_title_box .title {
	display: block;
	position: relative;
	font-size: 1.7rem;
	color: #666666;
	vertical-align: middle;
	line-height: 160%;
	margin-bottom: 5px;
	margin-top: -2.0rem;
	/*
	padding-left: 27%;
	padding-top: 2px;
	padding-bottom: 3px;
	margin-top: -28px;
	*/
}

/*記事のジャンル　p*/
.category_news .news_title_box .genre{
	display: inline-block;
	position: relative;
	margin-right: 1px;
	margin-top: -1px;
	min-width: 64px;
	text-align: center;
	font-size: 1.1rem;
	padding: 2px 6px 2px 6px;
	background-color: #d9d9d9;
}

.category_news .news_title_box .title.icon_new:after,
.frontpage_news_list li .title.icon_new:after {
	content: "[NEW]";
	display: inline-block;
	position: relative;
	font-size: 11px;
	font-weight: 500;
	margin-left: 3px;
	margin-top: -3px;
	vertical-align: middle;
	background-color: transparent;
	color: #f5665b;
	line-height: 100%;
	padding: 2px 2px 2px 2px;
}

.category_news .news_title_box .title a {
	color: #333333;
	text-decoration: none;
}

.category_news .news_title_box .title a:hover {
	text-decoration: underline;
}


/*ページネーション（ソースはネット共通のもの）*/

/*お知らせ、ブログ、検索結果共通*/

/*
Plugin Name: WP-Digg Style Paginator
Plugin URI: http://www.mis-algoritmos.com/2007/09/09/wp-digg-style-pagination-plugin-v-10/
Author: Victor De la Rocha
Author URI: http://www.mis-algoritmos.com
*/

/*Quotes style*/

.wp-pagenavi,
.pagination {
	padding: 3px;
	margin: 20px 3px 50px 3px;
	text-align: center;
	letter-spacing: normal;
}

.wp-pagenavi span{
	display: inline-block;
	/*padding: 1px 8px 1px 8px;*/
	min-width: 32px;
	margin-left: 0.2vw;
	text-decoration: none;
	color: #333333 !important;
	font-weight: normal !important;
	letter-spacing: normal;
}

.wp-pagenavi span.pages{
	margin-right: 1.5vw;
}

.wp-pagenavi a,
.pagination a {
	display: inline-block;
	padding: 1px 8px 1px 8px;
	min-width: 32px;
	margin-right: 0.2vw;
	text-decoration: none;
	color: #333333 !important;
	font-weight: normal !important;
	letter-spacing: normal;
}

.wp-pagenavi a.previouspostslink,
.wp-pagenavi a.nextpostslink {
	padding-left: 2.5vw;
	padding-right: 2.5vw;
	border: solid 1px #CACACA !important;
}

.wp-pagenavi a:hover,
.wp-pagenavi a:active,
.pagination a:hover,
.pagination a:active {
	text-decoration: none;
	background-color: #f0f0f0;
	
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}

.wp-pagenavi a:hover.previouspostslink,
.wp-pagenavi a:hover.nextpostslink {
	padding-left: 2.5vw;
	padding-right: 2.5vw;
}

.wp-pagenavi span.current,
.pagination span.current {
	display: inline-block;
	padding: 1px 8px 1px 8px;
	min-width: 32px;
	border: 1px solid #e2e2e2;
	font-weight: bold;
	background-color: #e2e2e2;
	color: #333333;
	
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}

.wp-pagenavi span.disabled,
.pagination span.disabled {
	display: inline-block;
	padding: 1px 8px 1px 8px;
	min-width: 32px;
	border: 1px solid #f3f3f3;
	color: #ccc;
}


/*News、Blog記事単体ページ下部の記事間リンクナビゲーション*/

.news_footer_navi_box, .blog_footer_navi_box {
	display: block;
	position: relative;
	overflow: hidden;
	margin: 0 auto;
	margin-top: 60px;
	margin-bottom: 40px;
	max-width: 1140px;
	border-top: solid 1px #D8D8D8;
	float: none;
	clear: both;
}

.nav-single {
	display: block;
	position: relative;
	overflow: hidden;
	float: none;
	text-align: center;
	padding-top: 40px;
	line-height: 100% !important;
}

.nav-previous, .nav-next {
	display: block;
	position: relative;
	width: 40%;
	margin-bottom: 15px;
	vertical-align: top;
	text-align: right;
}

.nav-previous {
	display: block;
	position: relative;
	float: left;
	padding-left: 1.5rem;
}

.nav-next {
	display: block;
	position: relative;
	width: 40%;
	float: right;
	padding-right: 1.5rem;
	text-align: left;
}


/*span*/

.nav-previous, .nav-next, .button_to_list {
	font-size: 90%;
	line-height: 100% !important;
}

.button_to_list {
	display: inline-block;
	position: relative;
	text-align: center;
}

.nav-previous a, .nav-next a, .button_to_list a {
	display: inline-block;
	padding: 6px 8px 6px 8px;
	padding-left: 2.0rem;
	padding-right: 2.0rem;
	border: solid 1px #CACACA !important;
	min-width: 28px;
	margin-right: 0.5rem;
	margin-left: 0.5rem;
	text-decoration: none;
	color: #333333 !important;
	font-weight: normal !important;
	background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, #000000 50%);
	background-position: 0 0;
	background-size: 200% auto;
	transition: .3s;
}

.nav-previous a:hover, .nav-next a:hover, .button_to_list a:hover {
	background-position: 0 -100%;
	color: #ffffff !important;
	text-decoration: none;
}


/*「前の記事」「次の記事」ボタンが非アクティブの場合のグレーアウト*/

.nav-previous a.grayout, .nav-next a.grayout, .nav-previous a.grayout:hover, .nav-next a.grayout:hover, .nav-previous span, .nav-next span {
	display: inline-block;
	padding: 6px 8px 6px 8px;
	padding-left: 2.0rem;
	padding-right: 2.0rem;
	border: 1px solid #dcdcdc;
	min-width: 28px;
	margin-right: 0.5rem;
	margin-left: 0.5rem;
	text-decoration: none;
	color: #dcdcdc !important;
	font-weight: normal !important;
	pointer-events: none;
}





/*記事ページのページタイトル欄　div*/
.news_page_title_box {
	display: block;
	position: relative;
	padding-right: 8%;
	margin-bottom: 40px;
}


/*お知らせ記事タイトル*/
.news_page_title_box {
	margin-bottom: 10px;
}

.news_page_title_box .title {
	color: #333333 !important;
}


/*日付　p*/
.news_page_title_box .date{
	display: inline-block;
	position: relative;
	font-size: 13px;
	color: #999999;
	margin-right: 6px;
	vertical-align: middle;
	line-height: 100%;
}


/*記事のジャンル　p*/
.news_page_title_box .genre{
	display: inline-block;
	position: relative;
	font-size: 11px;
	color: #ffffff;
	vertical-align: middle;
	background-color: rgb(0, 174, 175, 1);/**/
	line-height: 100%;
	padding: 4px 2rem 4px 2rem;
	
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
}


.category_news .link_box{
	padding-top: 40px;
}

.news_page_content_box{
	display: block;
	position: relative;
	margin-bottom: 50px;
}


/*--------------------------------

「404 Not found」ページ　ディレクトリ：404

--------------------------------*/

.box_404{
	display: block;
	position: relative;
	margin: 0 auto;
	width: 50%;
	max-width: 560px;
	padding-bottom: 20%;
	background: url(../img/404.svg) no-repeat center center;
	background-size: contain;
	opacity: 0.3;
}



/*=========================iPad用スタイルここから=========================*/


@media screen and (min-width: 736px) and (max-width: 1024px) {/*元 min-width:768、max-width: 920px*/
/*iPhone Plusの横向きのwidthが736pxのため、Plusでは縦でスマホ版、横でiPad版を表示*/

	body {
		min-width:initial;
	}
	
	body:before{
		width: 20px;
	}
	
	body:after{
		width: 20px;
	}
	
	/* -------------------------------- 
	
 	レイアウト設定
 	
	-------------------------------- */
	
	/*大枠の構成
		#top　ページトップアンカー
		.header　ヘッダー
		.drawermenu　グランドメニュー
		.contents_all　コンテンツ
		.footer　フッター
		.topicpath_area　パンくず
	*/
	
	
	/* --------------------
	iPad
	ヘッダー
	
	-------------------- */
	
	.header_inner{
		min-width: auto;
		max-width: auto;
	}
	
	/*固定ヘッダーロゴ　div*/
	.btn_logo{
		left:20px;
	}
	
	.header_menu{
	}
	
	.header_menu ul li.header_tel{
	}
	
	/*画面幅930未満*/
	@media (max-width: 930px) {
		.header_menu ul li.header_tel{
			display: none;
		}
	}
	
	.header_menu ul li.header_tel a {
		pointer-events: visible;
	}
	
	.header_menu ul li.header_tel a:hover{
		color: #ffffff !important;
		opacity: 0.8;
	}
	
	.header_menu ul li.header_tel a span{
		color: #ffffff !important;
	}
	
	
	/* --------------------
	
	グランドメニュー（ドロワーメニュー）
	
	-------------------- */
	
	.drawermenu{
	}
	
	.drawermenu_outer{
	}
	
	.drawermenu_inner{

	}
	
	.drawermenu_logo{

	}
	
	.drawermenu_logo a{
		
	}
	
	/*div*/
	.drawermenu_1list_box{

	}
	
	.drawermenu_1list_box.drawermenu3{

	}

	
	
	/* -------------------------------- 
	iPad
 	コンテンツ欄
 	
	-------------------------------- */
	
	.anker{
		margin-top:90px;
		padding-top: 90px;
	}
	
	#contents_all{
		min-width: auto;
		/*
		padding-left: 20px;
		padding-right: 20px;
		*/
		padding-left: 40px;
		padding-right: 40px;
	}
	
	.frontpage #contents_all{
	}

	
	
	/*------------------------------
	
	フッター
	
	------------------------------*/
	
	#footer{

	}
	
	.footer_contact_link a{
		display: flex;
		justify-content: center; /* 子要素をflexboxにより左右中央に配置する */
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		padding: 30px 40px 30px 40px;
		background-color: #2494d6;
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.footer_contact_link a br{
		display: none;
	}
		
	/*コピーライト*/
	.footer_copyright{
		padding-right: 70px;
	}
	
	/* ----------ページTOPへボタン---------- */
	#pagetop_wrapper {
	
		position: fixed;
		
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		right: 10px;
		bottom: 10px;
		width: 50px;
		height: 50px;
		padding: 0;
		
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		
		z-index: 100;
	}
	
	.pagetop{
		display: inline-block;
		position: relative;
		width: 50px;
		height: 50px;
	}
	
	/*a*/
	.pagetop a {
		display: inline-block;
		position: relative;
		
		width: 50px;
		height: 50px;
		background: url("../img/pagetop.svg") no-repeat center center;
		background-size: contain;
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	
	
	
	
	/*------------------------------
	
	各パーツ設定
	
	------------------------------*/
	
	.tablet_only {
		display:inline-block !important;
	}
	
	/* ---------- div内で2列にならべるdiv ---------- */
	
	/*2列全体　div*/
	.text_box_2column{

	}
	
	.text_box_2column .column_inner{
		margin-right: 4%;
	}
	
	.text_box_2column .column_inner:nth-child(2n){
		margin-right: 0%;
	}
	
	.text_box_2column.column_6_4 .column_inner:nth-child(1n){
		width: 52%;
	}
	
	.text_box_2column.column_6_4 .column_inner:nth-child(2n){
		width: 44%;
	}
	
	.text_box_2column.column_7_3 .column_inner:nth-child(1n){
		width: 72%;
	}
	
	.text_box_2column.column_7_3 .column_inner:nth-child(2n){
		width: 24%;
	}
	
	
	.text_box_2column .column_inner:nth-child(2n){
		margin-right: 0%;
	}
	
	.text_box_2column.column_4_6 .column_inner:nth-child(1n){
		width: 44%;
	}
	
	.text_box_2column.column_4_6 .column_inner:nth-child(2n){
		width: 52%;
	}
	
	.text_box_2column.column_3_7 .column_inner:nth-child(1n){
		width: 24%;
	}
	
	.text_box_2column.column_3_7 .column_inner:nth-child(2n){
		width: 72%;
	}
	
	/* ---------- div内で3列にならべるdiv ---------- */

	/* ---------- div内で4列にならべるdiv ---------- */

	
	
	.column_inner .button{
		min-width: 80%;
	}

	
	/*--------------------------------
	iPad
	トップページ専用スタイル
	
	--------------------------------*/
	
	/*--------------- トップページのみのスタイル（メインビジュアル） ---------------*/
	
	/*section*/
	.mainvisual_area{
		margin-bottom: 200px;
	}
	
	.mainvisual_catchcopy_box{
	}
	
	.mainvisual_catchcopy_box{
		display: inline-block;
		position: absolute;
		bottom: 100px;
		left: 60px;
		z-index: 2;
	}
	
	.mainvisual_catchcopy{
		font-size: 5.8rem;
		}
	
	/*--------------- トップページ構成要素の共通パーツ ---------------*/
	
	.frontpage_section_title_box{

	}
	
	.frontpage_section_title{
		font-size: 3.4rem;
	}
	
	
	/*--------------- トップページの導入部分 ---------------*/
	.introduction{
		padding-left: 60px;
		padding-right: 60px;
		margin-bottom: 60px;
	}
	
	.mainvisual_catchcopy_english{
		display: inline-block;
		position: absolute;
		margin-top: -20vh;
		top: 0;
		left: 60px;
		width: 65%;
		max-width: 860px;
		aspect-ratio: 850 / 400;/*縦横比固定*/
		background: url("../img/frontpage_introduction_title_e.svg") no-repeat left top;
		background-size: contain;
		z-index: 2;
	}
	
	.frontpage_introduction_2column .column_inner{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		
	}
	
	.frontpage_introduction_2column .column_inner:nth-of-type(1){
		width: 60%;
		padding-top: 7%;
		padding-right: 5%;
		z-index: 3;
	}
	
	.frontpage_introduction_2column .column_inner:nth-of-type(2){
		width: 40%;
	}
	
	
	/*--------------- トップページの「01事業案内」 ---------------*/
	
	.service{
		padding-top: 75px;
		padding-left: 60px;
		padding-right: 60px;
		padding-bottom: 0px;
	}
	
	.frontpage_service_2column{
		margin-bottom: 30px;
	}
	
	.service:before{
		content:"";
		display: block;
		position: relative;
		height: 75px;
		margin: 0 auto;
		margin-left: -60px;
		margin-right: -60px;
		margin-top: -75px;
		margin-bottom: 40px;
		background: url("../img/frontpage_service_title_bg.svg") no-repeat right 21px top;
		background-size: auto 75px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.service:after{
		content:"";
		display: block;
		position: absolute;
		width: 28px;
		height: 28px;
		top: 75px;
		left: 20px;
		background-color: #2494d7;
	}
	
	.frontpage_service_3column{
	}
	
	.frontpage_service_3column .column_inner{
		width: 48%;
		margin-right: 4%;
		}
		
	.frontpage_service_3column .column_inner:nth-of-type(1n){
	
	}

	.frontpage_service_3column .column_inner:nth-of-type(3n){
		margin-right: 4%;
	}
	
	.frontpage_service_3column .column_inner:nth-of-type(2n){
		margin-right: 0%;
	}
	
	.service_name{
		font-size: 1.8rem;
	}
	
	/*--------------- トップページの「02NEWS」 ---------------*/
	
	.news{
		display: block;
		position: relative;
		margin: 0 auto;
		padding: 80px 20px 0px 20px;
		margin-bottom: 80px;
	}
	
	.news:before{
		content:"";
		display: block;
		position: relative;
		margin: 0 auto;
		margin-left: -40px;
		margin-right: -40px;
		background-size: auto 150px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.news:after{
		content:"";
		display: block;
		position: relative;
		margin: 0 auto;
		margin-left: -40px;
		margin-right: -40px;
		background-size: auto 150px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.blue_cube:after{
		content:"";
		display: block;
		position: absolute;
		width: 28px;
		height: 28px;
		top: 80px;
		left: 20px;
		background-color: #2494d7;
	}
	
	.news .section_inner .title_box {
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		width: 180px;
	}
	
	.news .section_title{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		padding:23px 20px 23px 40px;
		font-family: "dnp-shuei-mgothic-std", sans-serif;/*ウェイトは400、600*/
		font-size: 1.6rem;
		font-weight: 400;
		margin-bottom: 0px;
		max-height: 100px;
	}
	
	.news .section_title img{
		height: 30px;
		width: auto;
	}
	
	.news .section_inner .news_list_box{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		width: calc(100% - 180px);
	}
	
	/*お知らせ1記事分 div*/
	.news_1box{
	}
	
	/*お知らせタイトルのクリック範囲*/
	.news_click_area{
		min-height: 80px;
		padding:14px 20px 14px 20px;
	}
	
	/* 答えのエリア div */
	.news_contents_box{
		display: none;
		position: relative;
		width:100%;
		margin:0px 0px 14px 0px;
		padding:10px 20px 14px 20px;
		
		opacity: 1;
		animation: answer_triangle_fade 0.5s linear;
		-webkit-animation: answer_triangle_fade 0.5s linear;
		-moz-animation: answer_triangle_fade 0.5s linear;
	}
	
	.accordion_icon {
		position: absolute;
		right:3%;
		top:calc(50% - 15px);
		width: 30px;
		height: 30px;
		background: url("../img/icon_down.svg") no-repeat center center;
		background-size: contain;
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	/*--------------- トップページの「03施工事例」 ---------------*/
	
	.ex{
		display: block;
		position: relative;
		margin: 0 auto;
		background: url("../img/frontpage_ex_bg.jpg") no-repeat center top;
		background-size: cover;
		padding-top: 50px;
		padding-bottom: 60px;
	}
	
	.ex_title_e_box{
		display: inline-block;
		position: relative;
		height: 80px;
		border-top: solid 1px color(display-p3 0.318 0.49 0.639);
		border-bottom: solid 1px color(display-p3 0.318 0.49 0.639);
		margin-bottom: 60px;
	}
	
	.ex_title_infiniteslide li img{
		margin-right: 100px;
		height: 78px;
	}
	
	.ex .section_inner{
		display: block;
		position: relative;
		margin: 0 auto;
		padding-left: 60px;
		padding-right: 60px;
		max-width: 1520px;
	}
	
	.ex_title_e_box:after{
		content:"";
		display: block;
		position: absolute;
		width: 28px;
		height: 28px;
		bottom: -29px;
		left: 20px;
		background-color: rgba(36, 148, 215, 0.7);
	}
	
	.ex .frontpage_section_title_box {
			margin-bottom: 60px;
	}
	
	/*--------------- トップページの「04会社概要」 ---------------*/
	
	.company{
		display: block;
		position: relative;
		margin: 0 auto;
		padding: 80px 40px 0px 40px;
		margin-bottom: 80px;
		min-height: 400px;
	}
	
	.company:before{
		content:"";
		display: block;
		position: relative;
		margin: 0 auto;
		margin-left: -40px;
		margin-right: -40px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.company:after{
		content:"";
		display: block;
		position: absolute;
		bottom: 0px;
		right: 21px;
		width: 48%;
		aspect-ratio: 900 / 160;/*縦横比固定*/
		background: url("../img/frontpage_company_bg_wataru.svg") no-repeat right bottom;
		background-size: contain;
		max-width: 800px;
	}
	
	.blue_cube:after{
		content:"";
		display: block;
		position: absolute;
		width: 28px;
		height: 28px;
		top: 80px;
		left: 20px;
		background-color: #2494d7;
	}
	
	.company .title_box:after{
		content:"";
		display: block;
		position: relative;
		margin: 0 auto;
		margin-left: -40px;
		margin-right: -40px;
		background-size: auto 150px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.company .title_box .title_box_inner{
		display: block;
		position: relative;
		margin: 0 auto;
		max-width: calc(1280px + 70px + 70px);
	}
	
	.company .section_title{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		padding:23px 20px 23px 20px;
		font-family: "dnp-shuei-mgothic-std", sans-serif;/*ウェイトは400、600*/
		font-size: 1.6rem;
		font-weight: 400;
		margin-bottom: 0px;
		max-height: 100px;
	}
	
	.company .section_title img{
		height: 30px;
		width: auto;
	}
	
	.company .section_inner{
		display:block;
		position: relative;
		margin: 0 auto;
		padding-left: 20px;
		padding-right: 20px;
		max-width: calc(1280px + 60px + 60px);
	}
	
	.frontpage_company_text{
		font-size: 1.8rem;
		margin-bottom: 40px;
	}

	
	/*--------------------------------
	iPad
	下層ページ共通部分
	
	--------------------------------*/
	
	/*ページタイトルの下からフッダーの上までのコンテンツ欄*/
	
	.contents_all{
		padding: 0px 60px 0px 60px;
	}
	
	/*ページタイトル基本形*/
	.page_title_box{
		display: block;
		position: relative;
		text-align: left;
		margin: 0 auto;
		margin-top: 120px;
		padding: 0px 20px 20px 20px;
		border-top: solid 1px #636363;
	}
	
	.page_title_box:after{
		content:"";
		display: block;
		position: absolute;
		width: 28px;
		height: 28px;
		top: 0px;
		left: 20px;
		background-color: #2494d7;
	}
	
	.page_title_inner{
		
	}
	
	/*ページタイトル 英語*/
	.page_title_box .title_english {
		display: inline-block;
		position: relative;
		width: 100%;
		height: 74px;
		padding: 15px 10px 15px 40px;
		border-bottom: solid 1px #636363;
		margin-bottom: 10px;
	}
	
	.page_title_box .title_english span{
		display: none;
	}
	
	.category_service .page_title_box .title_english {
		background: url("../img/title_service.svg") no-repeat left 40px center;
		background-size: auto 32px;
	}
	
	.category_company .page_title_box .title_english {
		background: url("../img/title_company.svg") no-repeat left 40px center;
		background-size: auto 32px;
	}
	
	.category_ex .page_title_box .title_english {
		background: url("../img/title_example.svg") no-repeat left 40px center;
		background-size: auto 32px;
	}
	
	.category_contact .page_title_box .title_english {
		background: url("../img/title_contact.svg") no-repeat left 40px center;
		background-size: auto 32px;
	}
	
	/*ページタイトル 日本語*/
	.page_title_box .page_title{
		display: block;
		position: relative;
		padding-left: 40px;
		font-size: 2.4rem;
		font-weight: 600;
		line-height: 140%;
	}
	
	.page_title_box .title_text {
	}
	
	
	.section_inner{
		display: block;
		position: relative;
		margin: 0 auto;
		max-width: 1200px;
	}
	
	/*段落ごとのくくり*/
	.content_box{
		display: block;
		position: relative;
		margin: 0 auto;
		margin-bottom: 100px;
	}
	
	.content_box h3{
		color: #000000;
		font-size: 2.6rem;
		margin-bottom: 30px;
		font-weight: 700;
		/*-webkit-text-stroke-width: 1px;*/
	}
	
	/*段落のタイトル　日本語プラス英語の、罫線があるテンプレート*/
	.section_title_box{
		display: flex;
		position: relative;
		justify-content: flex-start; /*左寄せ（デフォルト）*/
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		margin-left: -60px;
		margin-right:  -60px;
		margin-bottom: 40px;
		border-top: solid 1px #636363;
		border-bottom: solid 1px #636363;
	}
	
	.content_box h3.section_title{
		display: inline-block;
		position: relative;
		padding: 25px 50px 30px 60px;
		margin-bottom: 0px;
		font-size: 2.8rem;
		font-weight: 500;
		line-height: 100%;
		border-right: solid 1px #636363;
		-webkit-text-stroke-width: 0px;
	}
	
	.section_title_e{
		position: relative;
		color: #000000;
		font-size: 2.0rem;
		font-weight: 500;
		padding-left: 40px;
		line-height: 100%;
	}
	
	.section_title_e:before{
		content:"";
		display: block;
		position: absolute;
		width: 23px;
		height: 23px;
		top: calc(50% - 12px);
		left: calc(0px - 12px);
		background-color: #2494d7;
	}
	
	
	/*--------------------------------
	iPad
	「事業案内」ページ　ディレクトリ：service/
	
	--------------------------------*/
	
	.category_service{
		
	}
	
	.entry_service{
		
	}
	
	/*ワタルが選ばれる理由タイトル*/
	.service_reason_title_box{
		display: flex;
		position: relative;
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		background-color: #2391D2;
		padding: 15px 60px 15px 60px;
		margin-left: -60px;
		margin-right:  -60px;
		margin-bottom: 40px;
		border-top: solid 1px #636363;
		border-bottom: solid 1px #636363;
	}
	
	.content_box h3.service_reason_title{
		display: inline-block;
		position: relative;
		width: 100%;
		margin: 0 auto;
		max-width: 1200px;
		color: #ffffff;
		font-weight: 700;
		font-size: 3.2rem;
		text-align: left;
		-webkit-text-stroke-width: 1px;/*太字*/
	}
	
	.service_reason_3column{}
	.service_reason_3column .column_inner{}
	
	.service_reason_catchcopy{
		padding: 15px 15px 15px 15px;
		font-size: 2.0rem;
		font-weight: 700;
		color: #2391D2;
		line-height: 130%;
		border-bottom: solid 1px #636363;
	}
	
	.service_reason_text{
		padding: 15px 15px 15px 15px;
		font-size: 1.6rem;
	}
	
	
	.service_about_column_box{}
	
	.service_about_column_box .column_inner{
		width: 58%;
	}
	
	.service_about_title_box{
		display: block;
	}
	
	.service_about_title{
		display: block;
		position: relative;
		width: 100%;
		padding: 15px 15px 3px 15px;
		border-right: solid 0px #636363;
		font-size: 2.4rem;
		font-weight: 600;
		line-height: 130%;
	}
	
	.service_about_title_e{
		display: block;
		position: relative;
		width: 100%;
		padding: 0px 15px 15px 15px;
		font-size: 1.5rem;
		font-weight: 600;
		line-height: 130%;
	}
	
	.service_about_tag_box{}
	
	.service_about_tag_box ul{
		padding: 15px 15px 15px 15px;
	}
	
	.service_about_tag_box ul li{
		font-size: 1.4rem;
		background-color: #333333;
		color: #ffffff;
		padding: 2px 10px 2px 10px;
		margin-right: 3px;
		margin-bottom: 3px;
	}
	
	.service_about_text_box{
		display: flex; /* 子要素をflexboxで揃える */
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		padding: 15px 15px 15px 15px;
	}
	
	.service_about_column_box .column_inner:nth-of-type(2){
		display: flex; /* 子要素をflexboxで揃える */
		flex-direction: column; /* 子要素をflexboxにより縦並びに揃える */
		justify-content: center; /* 子要素をflexboxにより左右中央に配置する */
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		width: 42%;
		margin-right: 0%;
	}
	
	/*--------------------------------
	iPad
	「会社概要」ページ　ディレクトリ：company/
	
	--------------------------------*/
	
	.category_company{
		
	}
	
	.entry_company{
		
	}
	
	/*--------------------------------
	iPad
	「施工事例」ページ　ディレクトリ：ex/
	
	--------------------------------*/
	
	.category_ex{
		
	}
	
	.entry_ex{
		
	}
	
	.ex_column{}
	
	.ex_column .column_inner{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		width: 50%;
		aspect-ratio: 1 / 1;/*縦横比固定*/
		border-right: dotted 1px #282828;
		border-bottom: dotted 1px #282828;
		
		cursor: zoom-in;
	}
	
	.ex_column .column_inner:nth-of-type(3n) {
		border-right: dotted 1px #282828;
	}
	
	.ex_column .column_inner:nth-of-type(2n) {
		border-right: dotted 0px #282828;
	}
	
	/*--------------------------------
	iPad
	「お問い合わせ」ページ　ディレクトリ：contact/
	
	--------------------------------*/
	
	
	/*--------------------------------
	iPad
	「404 Not found」ページ　ディレクトリ：404
	
	--------------------------------*/



}/*iPad用スタイルここまで*/




/*=========================スマホ用スタイルここから（横画面）=========================*/


@media screen and (max-width:896px) and (orientation:landscape) {/*スマホ用 横画面*/

}







/*=========================スマホ用スタイルここから（縦画面）=========================*/

@media screen and ( max-width: 767px ) {/*元767*/

	body {
		background-color: #ffffff !important;
		min-width: 200px !important;
		width: 320px !important;
		width: 100% !important;
		margin-top: 0px !important;
		-webkit-text-size-adjust: 100%;
		
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		
	}
	
	body:before,
	body:after {
		content:none;
	}
	
	
	img {
		/*width: 100%;*/
		height: auto;
		max-width: 100%;
	}
	
	
	/* -------------------------------- 
	スマホ
 	レイアウト設定
 	
	-------------------------------- */
	
	/*大枠の構成
		#top　ページトップアンカー
		.header　ヘッダー
		.drawermenu　グランドメニュー
		.contents_all　コンテンツ
		.topicpath_area　パンくず
		.footer　フッター
	*/
	
	
	
	/* --------------------
	スマホ
	ページトップアンカー
	
	-------------------- */
	
	#top{
		
	}
	
	/* --------------------
	スマホ
	ヘッダー
	
	-------------------- */
	
	/*div*/
	
	.header{
		display: block;
		position: relative;
		width: 100%;
		height: 46px;
		/*min-width: 1120px;*/
		margin: 0 auto;
		text-align: right;
		background-color: #ffffff;
		
		z-index: 9999;
	}
	
	/*トップページのみ背景を透明に*/
	.frontpage .header {
	
	}
	
	.header_inner{
		display: block;
		position: relative;
		width: 100%;
		min-width: auto;
		height: 46px;
		padding-left: 0px;
		/*padding-left: calc(3vw + 240px;);*/
		padding-right: 0px;
		text-align: right;
	}
	
	/*ドロワーメニューが開いた時（bodyに「drawer-open」が付く）*/
	.drawer-open .header_inner{
	}
	
	
	/*固定ヘッダーロゴ　div*/
	.btn_logo{
		display: block;
		position: absolute;
		top:0px;
		left:15px;
		width: 170px;
		height: 46px;
		
		z-index: 10003;/*グランドメニューは10004; headerは10002*/
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.btn_logo a,
	.frontpage .btn_logo p{
		display: block;
		position: relative;
		width: 170px;
		height: 46px;
		background: url(../img/logo_horizontal.svg) no-repeat left center;
		background-size: auto 29px;
	}
	
	.frontpage .btn_logo p{
		background: url(../img/logo_horizontal.svg) no-repeat left center;
		background-size: auto 29px;
	}
	
	.frontpage .btn_logo p a{
		display: none;
	}
	
	.btn_logo p span{
		display: none;
	}
	
	/*ヘッダーメインメニュー　div（PCのみ表示）*/
	.header_menu{
		display: none;
	}
	
	
	
	/* --------------------
	スマホ
	グランドメニュー（ドロワーメニュー）
	
	-------------------- */
	
	.drawermenu{
	}
	
	/*ドロワー全体　nav　※背景色以外のstyleは「drawer.css」に記載*/
	.drawer-nav {	
		background-color: rgba(255,255,255, 0.95);
	}
	
	/*グランドメニュー全体　div*/
	.drawermenu_box {
		display:block;
		margin: 0 auto;
		padding: 0px 0px 10px 0px;
		width: 100%;
		min-height: 100vh;
		height: 100%;
	}
	
	.drawermenu.scroll_change .drawermenu_box {
	}
	
	.drawermenu_outer{
		display:block;
		position: relative;
		letter-spacing: -.40em;
		padding: 13px 4% 4% 4%;
		margin: 0 auto;
		width: calc(100% - 20px);
		
	}
	
	.drawermenu_logo{
		display: block;
		position: relative;
		vertical-align: middle;
		letter-spacing: normal;
		width: 100%;
		margin-bottom: 10px;
	}
	
	.drawermenu_logo a{
		display: block;
		position: relative;
		width: 180px;
		height: 54px;
		background: url(../img/logo_horizontal.svg) no-repeat left center;
		background-size: auto 30px;
	}
	
	.drawermenu_logo a span{
		display: none;
	}
	
	.drawermenu_inner{
		display: block;
		position: relative;
		text-align: left;
		padding-left: 0%;
		padding-right: 0%;
	}
	
	
	
	
	.drawermenu_1list_box {
		width: 100%;
	}
	
	.drawermenu_1list_box.drawermenu1{
		margin-right: 0%;
	}
	
	
	.drawermenu_1list_box ul {
	}
	
	.drawermenu_1list_box ul li{
		width: 100%;
		padding: 0px 0px 0px 0px;
		margin-bottom: 0px;
		background: none;
	}
	
	.drawermenu_1list_box ul li a{
		font-size: 1.6rem;
		display: block;
		white-space: normal;
		line-height: 130%;
		padding-top: 10px;
		padding-bottom: 10px;
		border-bottom: solid 1px #cecece;
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.drawermenu_1list_box ul li a:after {
		font-family: "Material Symbols Outlined";
		content: "\e5e1";
		position: absolute;
	 	top: 20px;
	 	right: 0px;
	 	transform: translate(-50%, -50%);
	 	-webkit-transform: translate(-50%, -50%);
	 	-ms-transform: translate(-50%, -50%);
		font-size: 14px;
	
		color: color(display-p3 0.29 0.573 0.824);
	}
	
	.drawermenu_1list_box ul li ul.submenu li a:after {
		top: 14px;
	}
	
	
	.drawermenu_1list_box li a:hover,
	.drawermenu_1list_box li a:hover span{
		color: color(display-p3 0.29 0.573 0.824) !important;
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	
	/*div*/
	.drawermenu_1list_box{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		text-align: left;
		margin-right: 12%;
	}
	
	
	.drawermenu_1list_box ul{
		display: block;
		position: relative;
		overflow: hidden;
	}
	
	.drawermenu_1list_box ul.drawermenu_list > li,
	.drawermenu_1list_box.drawermenu ul.drawermenu_list > li {
		display: block;
		position: relative;
		margin-bottom: 0.0rem;
		white-space: nowrap;
	}
	
	.drawermenu_1list_box ul.drawermenu_list > li a span,
	.drawermenu_1list_box.drawermenu ul.drawermenu_list > li a span{
		display: inline-block;
		vertical-align: top;
		text-align: left;
		font-size: 9px;
		color: #8d8d8d;
		margin-bottom: 0px;
		width: 100px;
	}
	
	.drawermenu_1list_box ul.drawermenu_list li ul.submenu{
		margin-top: 0.5rem;
		margin-bottom: 10px;
		padding-left: 0px;
	}
	
	.drawermenu_1list_box ul.drawermenu_list li ul.submenu li{
		margin-bottom: 0.6rem;
	}
	
	.drawermenu_1list_box ul.drawermenu_list li ul.submenu li a{
		display: block;
		position: relative;
		vertical-align: top;
		font-size: 1.5rem;
		margin-left: 0px;
		white-space: normal;
		padding-top: 7px;
		padding-bottom: 7px;
		padding-left: 1.5rem;
		text-indent: 0rem;
	}
	
	.drawermenu_1list_box ul.drawermenu_list li ul.submenu li a:before{
		content:"";
		display: inline-block;
		position: relative;
		vertical-align: middle;
		width: 1.5rem;
		height: 1px;
		margin-right: 0.5rem;
		background-color: #767676;
		margin-top: -3px;
	}
	
	
	/* ハンバーガーメニュー */
	
	/*中身のハンバーガーメニュー部分のstyleは「drawer.css」に記載*/
	.btn_drawermenu{
		display: block;
		position: fixed;
		top:0px;
		left:0px;
		right:0px;
		width: 100%;
		/*min-width: 1100px;*/
		height: 46px;
		pointer-events: none;
		
		z-index: 10002;/*.drawer-nav（開いたドロワーメニュー）は10001*/
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	
	
	
	/* -------------------------------- 
	スマホ
 	コンテンツ欄
 	
	-------------------------------- */
	
	.anker{
		margin-top:-56px;
		padding-top: 56px;
	}
	
	
	/*------------------------------
	スマホ
	フッター
	
	------------------------------*/
	
	#footer{
		display: block;
		position: relative;
	}
	
	/**/
	.footer_contact_box{
		display: block;
		position: relative;
		/*min-width: 1260px;*/
		margin: 0 auto;
	}
	
	.footer_contact_box_inner{
		display: block;
		position: relative;
		margin: 0 auto;
	}
	
	.footer_content_box{
		display: block;
		position: relative;
		margin: 0 auto;
		background-color: #333333;
		border-top: solid 1px #ffffff;
	}
	
	.footer_content_box_inner{
		display:block;
		position: relative;
		margin: 0 auto;
	}
	
	.footer_contact_link{

	}
	
	.footer_contact_link a{
		display: flex;
		flex-direction: column; /* 子要素をflexboxにより縦並びに揃える */
		justify-content: center; /* 子要素をflexboxにより左右中央に配置する */
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		padding: 20px 20px 20px 20px;
		background-color: #2494d6;
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.footer_contact_link a:hover{
		background-color: #228bc8;
	}
	
	.footer_contact_link a img{
		max-width: 220px;
	}
	
	.footer_contact_text{
		padding-left: 3vw;
		font-size: 1.6rem;
		font-weight: 600;
		color: #ffffff;
		margin-top: 10px;
	}
	
	.footer_company_name_box{
		display: block;
		position: relative;
		width: 100%;
		letter-spacing: normal;
		padding: 40px 20px 20px 20px;
		border-right: solid 0px #ffffff;
	}
	
	.footer_company_logo{
		display: block;
		position: relative;
		
		width: 100%;
		height: auto;
		width: 100%;
		text-align: center;
	}
	
	.footer_company_logo a{
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	
	.footer_company_tel_box{
		display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
		flex-direction: column; /* 子要素をflexboxにより縦並びに揃える */
		letter-spacing: normal;
		padding: 0px 40px 80px 40px;
		text-align: left;
		margin-bottom: 0px;
		
	}
	
	.footer_tel{
		display: inline-block;
		text-align: left;
		font-size: 1.9rem;
		color: #ffffff;
	}
	
	.footer_tel span{
		display: inline-block;
		margin-right: 5px;
		font-size: 1.6rem;
	}
	
	.footer_tel a{
		pointer-events: visible;
		color: #ffffff;
		margin-right: 10px;
		text-decoration: underline;
	}
	
	.footer_time{
		display: inline-block;
		color: #ffffff;
	}
	
	.footer_time span{
		font-size: 1.5rem;
	}
	
	.footer_address{
		color: #ffffff;
	}
	
	.footer_gmap{
		color: #ffffff;
	}
	
	.footer_gmap a{
		color: #ffffff;
		text-decoration: underline;
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.footer_gmap a:after{
		content:"";
		display: inline-block;
		position: relative;
		width: 16px;
		height: 16px;
		background: url("../img/icon_marker_white.svg") no-repeat center center;
		background-size: contain;
		margin-left: 3px;
		top:3px;
	}
	
	.footer_gmap a:hover{
		opacity: 0.9;
	}

	
	/*コピーライト*/
	.footer_copyright{
		display: block;
	}
	
	.footer_copyright_inner{
	
	}
	
	.footer_copyright_inner p{
	
		font-size: 1.3rem;
		white-space: nowrap;
		line-height: 100%;
		text-align: left;
	}

	

	
	/* ----------ページTOPへボタン---------- */
	#pagetop_wrapper {
	
		position: fixed;
		
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		right: 5px;
		bottom: 5px;
		width: 46px;
		height: 46px;
		padding: 0;
		
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		
		z-index: 100;
	}
	
	.pagetop{
		display: inline-block;
		position: relative;
		width: 46px;
		height: 46px;
	}
	
	/*a*/
	.pagetop a {
		display: inline-block;
		position: relative;
		
		width: 46px;
		height: 46px;
		
		background: url("../img/pagetop.svg") no-repeat center center;
		background-size: contain;
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	
	
	
	
	
	
	/*------------------------------
	スマホ
	各パーツ設定
	
	------------------------------*/
	
	.section_content_box{
		display: block;
		position: relative;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 20px;
	}
	
	
	
	/* -------------------- H1 -------------------- */
	
	h1{
		font-size: 2.4rem;
		line-height: 130%;
	}
	
	
	
	/* -------------------- H2 -------------------- */
	
	h2{
		font-size: 2.1rem;
		line-height: 130%;
	}
	
	
	/* -------------------- H3 -------------------- */
	
	h3{
		font-size: 1.8rem;
		line-height: 130%;
	}
	
	
	/* -------------------- H4/H5/H6 見出し設定 -------------------- */
	
	h4{
		font-weight:500;
	}
	
	h5{
		font-weight:500;
	}
	
	h6{
		font-weight:500;
	}
	
	/* ---------- 記事のpノーマル ---------- */
	
	/*コメントタグをpダグで入れる場合に使用（<p class="comment">コメント</p>）*/
	p.comment {
		display: none;
	}
	
	/*右にfloatさせる　主にpタグに指定*/
	.float_left{
		float: left;
		padding-right: 10px;
	}
	
	.float_none{
		float:none;
		margin-right: 0px;
	}
	
	
	
	
	/* -----------------------
	スマホ
	各パーツ設定
	
	----------------------- */
	
	
	/* ---------- 記事のpノーマル ---------- */
	/*PCのスタイルをそのまま利用*/
	
	/*サイズアップ*/
	/*基本はPCのスタイルをそのまま利用*/
	/*SPのみフォントサイズを変更する場合*/
	.sp_fs_100{font-size:110% !important;}
	.sp_fs_110{font-size:110% !important;}
	.sp_fs_120{font-size:120% !important;}
	.sp_fs_130{font-size:130% !important;}
	.sp_fs_140{font-size:140% !important;}
	.sp_fs_150{font-size:150% !important;}
	.sp_fs_160{font-size:160% !important;}
	.sp_fs_170{font-size:170% !important;}
	.sp_fs_180{font-size:180% !important;}
	.sp_fs_190{font-size:190% !important;}
	.sp_fs_200{font-size:200% !important;}
	.sp_fs_210{font-size:210% !important;}
	.sp_fs_220{font-size:220% !important;}
	.sp_fs_230{font-size:230% !important;}
	.sp_fs_240{font-size:240% !important;}
	.sp_fs_250{font-size:250% !important;}
	.sp_fs_260{font-size:260% !important;}
	.sp_fs_270{font-size:270% !important;}
	.sp_fs_280{font-size:280% !important;}
	.sp_fs_290{font-size:290% !important;}
	.sp_fs_300{font-size:300% !important;}
	
	/*サイズダウン*/
	/*基本はPCのスタイルをそのまま利用*/
	/*SPのみフォントサイズを変更する場合*/
	.sp_fs_95{font-size:95% !important;}
	.sp_fs_90{font-size:90% !important;}
	.sp_fs_85{font-size:85% !important;}
	.sp_fs_80{font-size:80% !important;}
	.sp_fs_75{font-size:75% !important;}
	.sp_fs_70{font-size:70% !important;}
	.sp_fs_60{font-size:60% !important;}
	.sp_fs_50{font-size:50% !important;}
	.sp_fs_40{font-size:40% !important;}
	.sp_fs_30{font-size:30% !important;}
	.sp_fs_20{font-size:20% !important;}
	.sp_fs_10{font-size:10% !important;}
	
	
	
	/* ---------- スマホで非表示（display: none）にしたいものを囲むspanのclass ---------- */
	.sp_none{
		display: none !important;
	}
	
	/* ---------- スマホで非表示（display: none）にしたいものを囲むspanのclass ---------- */
	.sp_none{
		display: none !important;
	}
	
	.sp_mb0{
		margin-bottom: 0px !important;
	}
	
	.sp_mb1{
		margin-bottom: 1px !important;
	}
	
	.sp_mb2{
		margin-bottom: 2px !important;
	}
	
	.sp_mb3{
		margin-bottom: 3px !important;
	}
	
	.sp_mb4{
		margin-bottom: 4px !important;
	}
	
	.sp_mb5{
		margin-bottom: 5px !important;
	}
	
	.sp_mb6{
		margin-bottom: 6px !important;
	}
	
	.sp_mb7{
		margin-bottom: 7px !important;
	}
	
	.sp_mb8{
		margin-bottom: 8px !important;
	}
	
	.sp_mb9{
		margin-bottom: 9px !important;
	}
	
	.sp_mb10{
		margin-bottom: 10px !important;
	}
	
	.sp_mb15{
		margin-bottom: 15px !important;
	}
	
	.sp_mb20{
		margin-bottom: 20px !important;
	}
	
	.sp_mb25{
		margin-bottom: 25px !important;
	}
	
	.sp_mb30{
		margin-bottom: 30px !important;
	}
	
	.sp_mb40{
		margin-bottom: 40px !important;
	}
	
	.sp_mb50{
		margin-bottom: 50px !important;
	}
	
	.sp_mb60{
		margin-bottom: 60px !important;
	}
	
	.sp_mb70{
		margin-bottom: 70px !important;
	}
	
	.sp_mb80{
		margin-bottom: 80px !important;
	}
	
	.sp_mb90{
		margin-bottom: 90px !important;
	}
	
	.sp_mb100{
		margin-bottom: 100px !important;
	}
	
	
	
	.sp_mt0{
		margin-top: 0px !important;
	}
	
	.sp_mt10{
		margin-top: 10px !important;
	}
	
	.sp_mt20{
		margin-top: 20px !important;
	}
	
	.sp_mt30{
		margin-top: 30px !important;
	}
	
	.sp_mt40{
		margin-top: 40px !important;
	}
	
	.sp_mt50{
		margin-top: 50px !important;
	}
	
	.sp_mt60{
		margin-top: 60px !important;
	}
	
	.sp_mt70{
		margin-top: 70px !important;
	}
	
	.sp_mt80{
		margin-top: 80px !important;
	}
	
	.sp_mt90{
		margin-top: 90px !important;
	}
	
	.sp_mt100{
		margin-top: 100px !important;
	}
	
	
	.sp_mt-10{
		margin-top: -10px !important;
	}
	
	.sp_mt-20{
		margin-top: -20px !important;
	}
	
	.sp_mt-30{
		margin-top: -30px !important;
	}
	
	.sp_mt-40{
		margin-top: -40px !important;
	}
	
	.sp_mt-50{
		margin-top: -50px !important;
	}
	
	.sp_mt-60{
		margin-top: -60px !important;
	}
	
	.sp_mt-70{
		margin-top: -70px !important;
	}
	
	.sp_mt-80{
		margin-top: -80px !important;
	}
	
	.sp_mt-90{
		margin-top: -90px !important;
	}
	
	.sp_mt-100{
		margin-top: -100px !important;
	}
	
	
	
	.sp_pb0{
		padding-bottom: 0px !important;
	}
	
	.sp_pb1{
		padding-bottom: 1px !important;
	}
	
	.sp_pb2{
		padding-bottom: 2px !important;
	}
	
	.sp_pb3{
		padding-bottom: 3px !important;
	}
	
	.sp_pb4{
		padding-bottom: 4px !important;
	}
	
	.sp_pb5{
		padding-bottom: 5px !important;
	}
	
	.sp_pb6{
		padding-bottom: 6px !important;
	}
	
	.sp_pb7{
		padding-bottom: 7px !important;
	}
	
	.sp_pb8{
		padding-bottom: 8px !important;
	}
	
	.sp_pb9{
		padding-bottom: 9px !important;
	}
	
	.sp_pb10{
		padding-bottom: 10px !important;
	}
	
	.sp_pb15{
		padding-bottom: 15px !important;
	}
	
	.sp_pb20{
		padding-bottom: 20px !important;
	}
	
	.sp_pb25{
		padding-bottom: 25px !important;
	}
	
	.sp_pb30{
		padding-bottom: 30px !important;
	}
	
	.sp_pb40{
		padding-bottom: 40px !important;
	}
	
	.sp_pb50{
		padding-bottom: 50px !important;
	}
	
	.sp_pb60{
		padding-bottom: 60px !important;
	}
	
	.sp_pb70{
		padding-bottom: 70px !important;
	}
	
	.sp_pb80{
		padding-bottom: 80px !important;
	}
	
	.sp_pb90{
		padding-bottom: 90px !important;
	}
	
	.sp_pb100{
		padding-bottom: 100px !important;
	}
	
	
	
	.sp_pt0{
		padding-top: 0px !important;
	}
	
	.sp_pt10{
		padding-top: 10px !important;
	}
	
	.sp_pt20{
		padding-top: 20px !important;
	}
	
	.sp_pt30{
		padding-top: 30px !important;
	}
	
	.sp_pt40{
		padding-top: 40px !important;
	}
	
	.sp_pt50{
		padding-top: 50px !important;
	}
	
	.sp_pt60{
		padding-top: 60px !important;
	}
	
	.sp_pt70{
		padding-top: 70px !important;
	}
	
	.sp_pt80{
		padding-top: 80px !important;
	}
	
	.sp_pt90{
		padding-top: 90px !important;
	}
	
	.sp_pt100{
		padding-top: 100px !important;
	}
	
	
	/*スマホのみ左右中央揃えの指定　text-alignの略*/
	.sp_ta_center{text-align: center !important;}
	.sp_ta_left{text-align: left !important;}
	.sp_ta_right{text-align: right !important;}
	
	
	
	/* ---------- 記事のpノーマル ---------- */
	
	/* ---------- 白ベタエリア　div ---------- */
	
	/* ---------- 写真の配置設定 ---------- */
	
	/*WPのメディアライブラリから挿入されたとき、自動的に挿入されるdivのclass*/
	.wp-caption {
	}
	
	.wp-caption img {
		margin: 0;
		padding: 0;
		border: 0 none;
		
		height: auto;
	}
	
	/* ---------- 画像配置関連 キャプション付きの回し込み ---------- */
	
	img{
	
	}
	
	/*画像とキャプション両方を囲んだDIVのクラス設定：回り込み無し*/
	.alignone{
		display: block;
		width: 100%!important;
		margin-bottom: 10px;
		clear: left;
	}
	
	/*画像とキャプション両方を囲んだDIVのクラス設定：中央揃え*/
	/* ----------写真を中央に配置---------- */
	
	/* ----------画像まわしこみを解除----------*/
	.aligncenter {
		float: none;
	}
	
	/*画像とキャプション両方を囲んだDIVのクラス設定：画像が左寄せになる場合*/
	
	/*メディアライブラリから挿入した時の、imgのclass*/
	.aligncenter {
		padding-right: 0px;
		padding-left: 0px;
		margin: 0 auto;
		margin-bottom: 10px;
		width: 100%;
		height: auto;
		text-align: center;
		
		float: none;
	}
	
	.alignright {
		padding-right: 0px;
		margin-right: 0px;
		padding-left: 0px;
		margin-left: 0px;
		margin-bottom: 10px;
		width: 100%;
		height: auto;
		text-align: center;
		
		float: none;
	}
	
	.alignleft {
		padding-right: 0px;
		margin-right: 0px;
		padding-left: 0px;
		margin-left: 0px;
		margin-bottom: 10px;
		width: 100%;
		height: auto;
		text-align: center;
		
		float: none;
	}
	
	/*PCではalignleft、alignrightを指定しつつ、スマホではセンターにしたい場合。　※例）alignleft sp_aligncenter 併記*/
	.sp_aligncenter {
		display: block;
		padding-right: 0px;
		padding-left: 0px;
		margin: 0 auto !important;
		margin-bottom: 10px !important;
		height: auto;
		text-align: center !important;
		
		float: none;
	}
	
	.alignnone {
		padding-right: 0px;
		margin-right: 0px;
		padding-left: 0px;
		margin-left: 0px;
		margin-bottom: 10px;
		width: 100%;
		height: auto;
		text-align: center;
		
		float: none;
	}
	
	/*PCではalignleft、alignrightを指定しつつ、スマホではセンターにしたい場合。　※例）alignleft sp_alignnone 併記*/
	.sp_alignnone {
		display: block;
		padding-right: 0px;
		padding-left: 0px;
		margin: 0 auto !important;
		margin-bottom: 10px !important;
		height: auto;
		text-align: center !important;
		
		float: none;
	}
	
	
	img.aligncenter,
	img.alignright,
	img.alignleft,
	img.alignnone{
		text-align: center;
		margin: 0 auto;
		max-width: 100% !important;
	}
	
	
	
	/* ----------写真を左に配置---------- */
	.alignleft img {
		display: block;
		float: none;
		padding-right: 0px !important;
		margin-right: 0px !important;
		padding-left: 0px !important;
		margin-left: 0px !important;
		margin: 0 auto !important;
		margin-bottom: 10px !important;
		max-width: 480px !important;
		width: 100% !important;
		height: auto;
	}
	
	/* ----------写真を右側に配置---------- */
	.alignright img {
		display: block;
		float: none;
		padding-right: 0px !important;
		margin-right: 0px !important;
		padding-left: 0px !important;
		margin-left: 0px !important;
		margin: 0 auto !important;
		margin-bottom: 10px !important;
		max-width: 480px !important;
		width: 100% !important;
		height: auto;
	}
	
	/* ----------スマホだけ写真を中央に配置---------- */
	.aligncenter img,
	.sp_aligncenter img {
		display: block;
		float: none;
		padding-right: 0px !important;
		margin-right: 0px !important;
		padding-left: 0px !important;
		margin-left: 0px !important;
		margin: 0 auto !important;
		margin-bottom: 10px !important;
		max-width: 480px !important;
		width: 100% !important;
		height: auto;
	}
	
	
	/*キャプションのスタイル（alignnone、alignleft、alignrightの場合）*/
	p.wp-caption-text,
	.wp-caption-text {
		display: block;
		text-align: left;
		font-size: 90%;
		line-height: 140%;
		color: #797979;
		clear: both;
	}
	
	/*キャプションのスタイル（aligncenterの場合）*/
	.aligncenter .wp-caption-text{
		display: block;
		text-align: left;
		font-size: 90%;
		line-height: 130%;
		color: #797979;
		clear: both;
	}
	
	
	
	/* 右寄せで写真を縦に並べるカラム状のボックス */
	
	.photo_column_right{
		float:none;
	 	margin-left:0px;
	}
	
	/*alignleft、alignright等と併記して、横幅を%可変にする スマホのみ*/
	.sp_w10per{width: 10% !important;}
	.sp_w20per{width: 20% !important;}
	.sp_w30per{width: 30% !important;}
	.sp_w40per{width: 40% !important;}
	.sp_w50per{width: 50% !important;}
	.sp_w60per{width: 60% !important;}
	.sp_w70per{width: 70% !important;}
	.sp_w80per{width: 80% !important;}
	.sp_w90per{width: 90% !important;}
	.sp_w100per{width: 100% !important;}
	
	.sp_w10per img,
	.sp_w20per img,
	.sp_w30per img,
	.sp_w40per img,
	.sp_w50per img,
	.sp_w60per img,
	.sp_w70per img,
	.sp_w80per img,
	.sp_w90per img,
	.sp_w100per img{
		width: 100%;
		max-width: 100%;
		height: auto;
	}
	
	.trim.sp_w100per {
		display: block;
		overflow: hidden;
		position: relative;
		width: 100%;
		padding-bottom: 75%;/*4:3*/
		margin-bottom: 10px;
	}
	
	.trim.sp_w10per{
		width: 10%;
		padding-bottom: 7.5%;
	}
	
	.trim.sp_w20per{
		width: 20%;
		padding-bottom: 15%;
	}
	
	.trim.sp_w30per{
		width: 30%;
		padding-bottom: 22.5%;
	}
	
	.trim.sp_w40per{
		width: 40%;
		padding-bottom: 30%;
	}
	
	.trim.sp_w50per{
		width: 50%;
		padding-bottom: 37.5%;
	}
	
	.trim.sp_w60per{
		width: 60%;
		padding-bottom: 45%;
	}
	
	.trim.sp_w70per{
		width: 70%;
		padding-bottom: 52.5%;
	}
	
	.trim.sp_w80per{
		width: 80%;
		padding-bottom: 60%;
	}
	
	.trim.sp_w90{
		width: 90%;
		padding-bottom: 67.5%;
	}
	
	.trim.sp_w100perper{
		width: 100%;
		padding-bottom: 75%;
	}
	
	
	.trim_wide.sp_w100per {
		display: block;
		overflow: hidden;
		position: relative;
		width: 100%;
		padding-bottom: 56.625%;/*16:9*/
		margin-bottom: 10px;
	}
	
	.trim_wide.sp_w10per{
		width: 10%;
		padding-bottom: 5.6625%;
	}
	
	.trim_wide.sp_w20per{
		width: 20%;
		padding-bottom: 11.325%;
	}
	
	.trim_wide.sp_w30per{
		width: 30%;
		padding-bottom: 17%;
	}
	
	.trim_wide.sp_w40per{
		width: 40%;
		padding-bottom: 22.65%;
	}
	
	.trim_wide.sp_w50per{
		width: 50%;
		padding-bottom: 28.3125%;
	}
	
	.trim_wide.sp_w60per{
		width: 60%;
		padding-bottom: 33.975%;
	}
	
	.trim_wide.sp_w70per{
		width: 70%;
		padding-bottom: 39.6375%;
	}
	
	.trim_wide.sp_w80per{
		width: 80%;
		padding-bottom: 45.3%;
	}
	
	.trim_wide.sp_w90per{
		width: 90%;
		padding-bottom: 50.9625%;
	}
	
	.trim_wide.sp_w100per{
		width: 100%;
		padding-bottom: 56.625%;
	}
	
	.trim.sp_w100per img,
	.trim_wide.sp_w100per img {
		width: 100%;
		left: 50%;
		left: -webkit-calc(50%) ;
		left: calc(50%) ;
	}
	
	
	.sp_aligncenter.sp_w10per img,
	.sp_alignnone.sp_w10per img,
	.sp_aligncenter.sp_w20per img,
	.sp_alignnone.sp_w20per img,
	.sp_aligncenter.sp_w30per img,
	.sp_alignnone.sp_w30per img,
	.sp_aligncenter.sp_w40per img,
	.sp_alignnone.sp_w40per img,
	.sp_aligncenter.sp_w50per img,
	.sp_alignnone.sp_w50per img,
	.sp_aligncenter.sp_w60per img,
	.sp_alignnone.sp_w60per img,
	.sp_aligncenter.sp_w70per img,
	.sp_alignnone.sp_w70per img,
	.sp_aligncenter.sp_w80per img,
	.sp_alignnone.sp_w80per img,
	.sp_aligncenter.sp_w90per img,
	.sp_alignnone.sp_w90per img,
	.sp_aligncenter.sp_w100per img,
	.sp_alignnone.sp_w100per img{
		width: 100%;
		width: -webkit-calc(100%) ;
		width: calc(100%) ;
		left: 0% !important;
		left: -webkit-calc(0px) !important;
		left: calc(0px) !important;
	}
	
	.trim.sp_aligncenter.trim.sp_w10per img,
	.trim.sp_alignnone.trim.sp_w10per img,
	.trim.sp_aligncenter.trim.sp_w20per img,
	.trim.sp_alignnone.trim.sp_w20per img,
	.trim.sp_aligncenter.trim.sp_w30per img,
	.trim.sp_alignnone.trim.sp_w30per img,
	.trim.sp_aligncenter.trim.sp_w40per img,
	.trim.sp_alignnone.trim.sp_w40per img,
	.trim.sp_aligncenter.trim.sp_w50per img,
	.trim.sp_alignnone.trim.sp_w50per img,
	.trim.sp_aligncenter.trim.sp_w60per img,
	.trim.sp_alignnone.trim.sp_w60per img,
	.trim.sp_aligncenter.trim.sp_w70per img,
	.trim.sp_alignnone.trim.sp_w70per img,
	.trim.sp_aligncenter.trim.sp_w80per img,
	.trim.sp_alignnone.trim.sp_w80per img,
	.trim.sp_aligncenter.trim.sp_w90per img,
	.trim.sp_alignnone.trim.sp_w90per img,
	.trim.sp_aligncenter.trim.sp_w100per img,
	.trim.sp_alignnone.trim.sp_w100per img,
	.trim_wide.sp_aligncenter.trim_wide.sp_w10per img,
	.trim_wide.sp_alignnone.trim_wide.sp_w10per img,
	.trim_wide.sp_aligncenter.trim_wide.sp_w20per img,
	.trim_wide.sp_alignnone.trim_wide.sp_w20per img,
	.trim_wide.sp_aligncenter.trim_wide.sp_w30per img,
	.trim_wide.sp_alignnone.trim_wide.sp_w30per img,
	.trim_wide.sp_aligncenter.trim_wide.sp_w40per img,
	.trim_wide.sp_alignnone.trim_wide.sp_w40per img,
	.trim_wide.sp_aligncenter.trim_wide.sp_w50per img,
	.trim_wide.sp_alignnone.trim_wide.sp_w50per img,
	.trim_wide.sp_aligncenter.trim_wide.sp_w60per img,
	.trim_wide.sp_alignnone.trim_wide.sp_w60per img,
	.trim_wide.sp_aligncenter.trim_wide.sp_w70per img,
	.trim_wide.sp_alignnone.trim_wide.sp_w70per img,
	.trim_wide.sp_aligncenter.trim_wide.sp_w80per img,
	.trim_wide.sp_alignnone.trim_wide.sp_w80per img,
	.trim_wide.sp_aligncenter.trim_wide.sp_w90per img,
	.trim_wide.sp_alignnone.trim_wide.sp_w90per img,
	.trim_wide.sp_aligncenter.trim_wide.sp_w100per img,
	.trim_wide.sp_alignnone.trim_wide.sp_w100per{
		width: 100%;
		width: -webkit-calc(100%) ;
		width: calc(100%) ;
		left: 50% !important;
		left: -webkit-calc(50% - 0px) !important;
		left: calc(50% - 0px) !important;
	}
	
	
	
	/*スマホで、画像が大きすぎる場合、max-widthを指定して中央に配置　p このclassが指定されたpタグでくくったimgに適用される*/
	
	/*width:150px*/
	.img_width_150,
	.img_width_150{
		display: block !important;
		float: none !important;
		min-width: 300px;
		width: 100% !important;
		text-align: center !important;
	}
	
	.img_width_150 img,
	.img_width_150 img{
		max-width: 150px !important;
	}
	
	.img_width_150 img.alignright,
	.img_width_150 img.alignright,
	.img_width_150 img.alignleft,
	.img_width_150 img.alignleft{
		float: none !important;
	}
	
	/*width:180px*/
	.img_width_180,
	.img_width_180{
		display: block !important;
		float: none !important;
		min-width: 300px;
		width: 100% !important;
		text-align: center !important;
	}
	
	.img_width_180 img,
	.img_width_180 img{
		max-width: 180px !important;
	}
	
	.img_width_180 img.alignright,
	.img_width_180 img.alignright,
	.img_width_180 img.alignleft,
	.img_width_180 img.alignleft{
		float: none !important;
	}
	
	/*width:200px*/
	.img_width_200,
	.img_width_200{
		display: block !important;
		float: none !important;
		min-width: 300px;
		width: 100% !important;
		text-align: center !important;
	}
	
	.img_width_200 img,
	.img_width_200 img{
		max-width: 200px !important;
	}
	
	.img_width_200 img.alignright,
	.img_width_200 img.alignright,
	.img_width_200 img.alignleft,
	.img_width_200 img.alignleft{
		float: none !important;
	}
	
	/*width:250px*/
	.img_width_250,
	.img_width_250{
		display: block !important;
		float: none !important;
		min-width: 300px;
		width: 100% !important;
		text-align: center !important;
	}
	
	.img_width_250 img,
	.img_width_250 img{
		max-width: 250px !important;
	}
	
	.img_width_250 img.alignright,
	.img_width_250 img.alignright,
	.img_width_250 img.alignleft,
	.img_width_250 img.alignleft{
		float: none !important;
	}
	
	/*width:300px*/
	.img_width_300,
	.img_width_300{
		display: block !important;
		float: none !important;
		min-width: 300px;
		width: 100% !important;
		text-align: center !important;
	}
	
	.img_width_300 img,
	.img_width_300 img{
		max-width: 300px !important;
	}
	
	.img_width_300 img.alignright,
	.img_width_300 img.alignright,
	.img_width_300 img.alignleft,
	.img_width_300 img.alignleft{
		float: none !important;
	}
	
	/*スマホで画像の最大の横幅を規制して、center揃え　imgを囲んでいるdivやpタグにつけるclass*/
	.sp_width_10,
	.sp_width_16,
	.sp_width_20,
	.sp_width_24,
	.sp_width_30,
	.sp_width_36,
	.sp_width_40,
	.sp_width_48,
	.sp_width_50,
	.sp_width_60,
	.sp_width_70,
	.sp_width_80,
	.sp_width_90,
	.sp_width_100,
	.sp_width_120,
	.sp_width_160,
	.sp_width_180,
	.sp_width_210,
	.sp_width_220,
	.sp_width_240,
	.sp_width_270,
	.sp_width_300,
	.sp_width_320,
	.sp_width_340,
	.sp_width_420{
		width: 100% !important;
		float: none !important;
		text-align: center;
	}
	
	.sp_width_10 img{
		max-width: 10px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_16 img{
		max-width: 16px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_20 img{
		max-width: 20px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_24 img{
		max-width: 24px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_30 img{
		max-width: 30px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_36 img{
		max-width: 36px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_40 img{
		max-width: 40px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_48 img{
		max-width: 48px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_50 img{
		max-width: 50px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_60 img{
		max-width: 60px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_70 img{
		max-width: 70px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_80 img{
		max-width: 80px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_90 img{
		max-width: 90px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	.sp_width_100 img{
		max-width: 100px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	.sp_width_120 img{
		max-width: 120px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	.sp_width_160 img{
		max-width: 160px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	.sp_width_180 img{
		max-width: 180px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	.sp_width_210 img{
		max-width: 210px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	.sp_width_220 img{
		max-width: 220px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	.sp_width_240 img{
		max-width: 240px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	.sp_width_270 img{
		max-width: 270px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	.sp_width_300 img{
		max-width: 300px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_320 img{
		max-width: 320px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_340 img{
		max-width: 340px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	.sp_width_420 img{
		max-width: 420px !important;
		height: auto !important;
		text-align: center !important;
		float: none;
	}
	
	/*囲んでいるdivやpではなく、imgに直接classを追加した場合*/
	img.sp_width_10,
	img.sp_width_16,
	img.sp_width_20,
	img.sp_width_24,
	img.sp_width_30,
	img.sp_width_36,
	img.sp_width_40,
	img.sp_width_48,
	img.sp_width_50,
	img.sp_width_60,
	img.sp_width_70,
	img.sp_width_80,
	img.sp_width_90,
	img.sp_width_100,
	img.sp_width_120,
	img.sp_width_160,
	img.sp_width_180,
	img.sp_width_210,
	img.sp_width_220,
	img.sp_width_240,
	img.sp_width_270,
	img.sp_width_300,
	img.sp_width_320,
	img.sp_width_340,
	img.sp_width_420{
		height: auto !important;
	}
	
	img.sp_width_10{max-width: 10px;}
	img.sp_width_16{max-width: 16px;}
	img.sp_width_20{max-width: 20px;}
	img.sp_width_24{max-width: 24px;}
	img.sp_width_30{max-width: 30px;}
	img.sp_width_36{max-width: 36px;}
	img.sp_width_40{max-width: 40px;}
	img.sp_width_48{max-width: 48px;}
	img.sp_width_50{max-width: 50px;}
	img.sp_width_60{max-width: 60px;}
	img.sp_width_70{max-width: 70px;}
	img.sp_width_80{max-width: 80px;}
	img.sp_width_90{max-width: 90px;}
	img.sp_width_100{max-width: 100px;}
	img.sp_width_120{max-width: 120px;}
	img.sp_width_160{max-width: 160px;}
	img.sp_width_180{max-width: 180px;}
	img.sp_width_210{max-width: 210px;}
	img.sp_width_220{max-width: 220px;}
	img.sp_width_240{max-width: 240px;}
	img.sp_width_270{max-width: 270px;}
	img.sp_width_300{max-width: 300px;}
	img.sp_width_320{max-width: 320px;}
	img.sp_width_340{max-width: 340px;}
	img.sp_width_420{max-width: 420px;}
	
	/*スマホ用横幅ピクセル指定*/
	.sp_w10px{width: 10px !important;}
	.sp_w20px{width: 20px !important;}
	.sp_w30px{width: 30px !important;}
	.sp_w40px{width: 40px !important;}
	.sp_w50px{width: 50px !important;}
	.sp_w60px{width: 60px !important;}
	.sp_w70px{width: 70px !important;}
	.sp_w80px{width: 80px !important;}
	.sp_w90px{width: 90px !important;}
	.sp_w100px{width: 100px !important;}
	.sp_w110px{width: 110px !important;}
	.sp_w120px{width: 120px !important;}
	.sp_w130px{width: 130px !important;}
	.sp_w140px{width: 140px !important;}
	.sp_w150px{width: 150px !important;}
	.sp_w160px{width: 160px !important;}
	.sp_w170px{width: 170px !important;}
	.sp_w180px{width: 180px !important;}
	.sp_w190px{width: 190px !important;}
	.sp_w200px{width: 200px !important;}
	.sp_w300px{width: 300px !important;}
	.sp_w400px{width: 400px !important;}
	.sp_w500px{width: 500px !important;}
	.sp_w600px{width: 600px !important;}
	
	.sp_w10px img,
	.sp_w20px img,
	.sp_w30px img,
	.sp_w40px img,
	.sp_w50px img,
	.sp_w60px img,
	.sp_w70px img,
	.sp_w80px img,
	.sp_w90px img,
	.sp_w100px img,
	.sp_w110px img,
	.sp_w120px img,
	.sp_w130px img,
	.sp_w140px img,
	.sp_w150px img,
	.sp_w160px img,
	.sp_w170px img,
	.sp_w180px img,
	.sp_w190px img,
	.sp_w200px img{
		width: 100%;
		max-width: 100%;
		height: auto;
	}
	
	.sp_mw280px{max-width: 280px !important; width: 100%;}
	.sp_mw300px{max-width: 300px !important; width: 100%;}
	.sp_mw375px{max-width: 375px !important; width: 100%;}
	
	/* ---------- 記事内のテーブル設定 ---------- */
	
	/*レスポンシブさせたくないtableには「no_responsive_table」というclassを記述する*/
	/*.gsc-table-result　は、Googleの検索結果のテーブル*/
	/*.gcsc-branding　は、Googleの検索結果の下のpowered byのテーブル*/
	/*.table_img_2column は、横並びの画像をスマホでも横並びのまま表示するtableのclass*/
	/*.ui-datepicker-calendarは、MW WP Formの日付選択の時に表示されるカレンダーdatepickerのtableのclass*/
	
	
	table:not(.no_responsive_table):not(.table_img_2column):not(.open_searchbox table) {
		border: none !important;
		border-top: #e8e8e8 solid 1px !important;
	}
	
	/*あえて幅をせまく調整したテーブルでも、スマホでは横幅100%にする*/
	table.table_90per,
	table.table_80per,
	table.table_70per,
	table.table_60per,
	table.table_50per,
	table.table_40per,
	table.table_30per,
	table.table_20per,
	table.table_10per {
		width: 100% !important;
	}
	
	
	
	
	table:not(.no_responsive_table):not(.table_img_2column):not(.open_searchbox table) tr {
		display: block;
		border: none !important;
		border-bottom: #e8e8e8 solid 1px !important;
		padding:4px 0px 4px 0px;
		margin-bottom: 4px;
		width:100% !important;
	}
	
	
	
	table:not(.no_responsive_table):not(.table_img_2column):not(.open_searchbox table) th {
		padding: 4px 5px 0px 5px !important;
		margin-bottom: 4px !important;
		/*background-color: #EDEDE9;*/
		/*white-space: nowrap;*/
		overflow: hidden;
		display: block;
		border: none !important;
		width:100% !important;
		box-sizing: border-box !important;
		-moz-box-sizing: border-box !important;
		-webkit-box-sizing: border-box !important;
		-ms-box-sizing: border-box !important;
		font-size: 90%;
	}
	
	
	
	table:not(.no_responsive_table):not(.table_img_2column):not(.open_searchbox table) td {
		border-left: none !important;
		word-wrap: break-word;
		overflow: hidden;
		display: block;
		padding: 0px 5px 8px 5px !important;
		margin-bottom: 0px !important;
		border: none !important;
		width:100% !important;
	}
	
	.pb0,
	table:not(.no_responsive_table):not(.table_img_2column):not(.open_searchbox table) td.pb0{
		padding-bottom: 0px !important;
	}
	
	
	/*レスポンシブさせないテーブルのフォントはちょっと小さくする*/
	table.no_responsive_table tr{
		padding:0px 0px 0px 0px !important;
		font-size:96% !important;
		line-height:150% !important;
	}
	
	table.no_responsive_table th{
		padding: 8px 5px 8px 5px !important;
		font-size:86% !important;
		line-height:150% !important;
		white-space:nowrap !important;
	}
	
	table.no_responsive_table td{
		padding: 8px 5px 8px 5px !important;
		font-size:96% !important;
		line-height:150% !important;
	}
	
	
	
	/*tableをスクロールありで表示させる場合、これで囲む　div*/
	.table_scroll_box{
		width: auto !important;
		overflow-x:auto !important;
	}
	
	.table_scroll_box table.no_responsive_table {
		width: auto;
	min-width: 100%;
	}
	
	.table_scroll_box table.no_responsive_table tr th,
	.table_scroll_box table.no_responsive_table tr td{
		/*white-space: nowrap !important;*/
	}
	
	/*改行させない*/
	.sp_nowrap,
	table tr.sp_nowrap,
	table tr th.sp_nowrap,
	table tr td.sp_nowrap,
	p.sp_nowrap,
	span.sp_nowrap{
		white-space: nowrap !important;
	}
	
	
	th img,
	td img {
		display: block;
		margin-left: auto;
		margin-right: auto;
		max-width: 480px !important;
		width: 100% !important;
		height: auto;
	}
	
	
	/*横並びの画像をスマホでも横並びのまま表示するtable　のstyle罫線無し**/
	
	table.table_img_2column {
		border: none !important;
		display: block;
		max-width: 100%;
	}
	
	table.table_img_2column tr {
		font-size:96% !important;
		line-height:150% !important;
		border: none !important;
	}
	
	table.table_img_2column th {
		font-size:96% !important;
		line-height:150% !important;
		white-space:normal !important;
		border: none !important;
	}
	
	table.table_img_2column td {
		font-size:96% !important;
		line-height:150% !important;
		border: none !important;
	}
	
	table.table_img_2column img{
		margin-bottom: 0px !important;
	}
	
	
	
	table.table_2column {
		margin-bottom: 0.5rem;
		border-top: #dadada solid 1px;
		border-left: #dadada solid 1px;
		width: 100% !important;
		float: none !important;
		margin-right: 0% !important;
	}
	
	table.table_4column {
		margin-bottom: 0.5rem;
		border-top: #dadada solid 1px;
		border-left: #dadada solid 1px;
		width: 100% !important;
		float: none !important;
		margin-right: 0% !important;
	}
	
	
	/*スマホレスポンシブ対応のテーブル*/
	table.sp_responsive_table tr,
	table.sp_responsive_table th,
	table.sp_responsive_table td {
		display: block;
		width: 100%;
	}
	
	table.sp_responsive_table tr{
		margin-bottom: 3rem;
	}
	
	table.sp_responsive_table td {
		text-align: left;
	}
	
	table.sp_responsive_table .sp_only {
		display:inline-block !important;
	}
	
	/*スマホのみ、tr（の上辺）に罫線を追加するスタイル*/
	.tr_line_solid_sponly {
		border-top: #dadada solid 1px !important;
	}
	
	.tr_line_dotted_sponly {
		border-top: #dadada dotted 1px !important;
	}
	
	
	/*桁数を指定して揃える　半角で5文字分*/
	span.digit5{
		display:inline;
		width:auto !important;
		text-align: left;
	}
	
	/*桁数を指定して揃える　半角で6文字分*/
	span.digit6{
		display:inline;
		width:auto !important;
		text-align: left;
	}
	
	
	
	
	
	
	
	
	
	/*一番上の項目行を左の列に可変テーブル（「no_responsive_table」と併記）*/
	table.td_change_table {
		display: block;
		width: 100%;
		border-top: #DBD8CC solid 1px;
		border-left: #DBD8CC solid 0px;
		margin-bottom: 10px !important;
	}
	
	table.td_change_table.w_auto{
		width: auto;
	}
 	
	table.td_change_table thead {
	  	display: none;
	}
	
	table.td_change_table tbody {
	  	display: block;
	}
	
	table.td_change_table tbody tr {
		display: block;
		position: relative;
		width: 100%;
		padding: 0px !important;
		margin-bottom: 5px;
		
		border-top: #DBD8CC solid 1px !important;
		border-left: #DBD8CC solid 1px !important;
		border-bottom: #DBD8CC solid 0px !important;
		
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	
	table.td_change_table tbody tr:first-Child {
		border-top: #DBD8CC solid 0px !important;
	}
	
	table.td_change_table > tbody > tr > th,
	table.td_change_table > tbody > tr > td {
	  	display: flex;
	  	overflow: hidden;
	  	
	  	padding: 0px 0px 0px 0px !important;
	  	border-right: #DBD8CC solid 0px !important;
	  	
	  	-webkit-box-sizing: border-box;
	  	-moz-box-sizing: border-box;
	  	box-sizing: border-box;
	  	font-size: 1.4rem !important;
	}
	
	
	table.td_change_table tbody tr th:before,
	table.td_change_table tbody tr td:before {
		display: block;
	  	width: 24%;
	  	content: attr(label);
	  	float: left;
	  	line-height: 140%;
	  	text-align: center;
	  	
	  	padding: 6px 10px 6px 10px !important;
	  	border-right: #DBD8CC solid 1px !important;
	  	
	  	-webkit-box-sizing: border-box;
	  	-moz-box-sizing: border-box;
	  	box-sizing: border-box;
	  	
	}
	
	table.td_change_table tbody tr th,
	table.td_change_table tbody tr th p{
	}
	
	
	/*左の列が不要な場合はtd、またはtdに「no_change」を付ける*/
	table.td_change_table tbody tr th.no_change:before,
	table.td_change_table tbody tr td.no_change:before {
		content: none;
	}
	
	table.td_change_table tbody tr th.no_change,
	table.td_change_table tbody tr td.no_change {
		padding: 6px 10px 6px 10px !important;
	}
	
	
	table.td_change_table tbody tr th .inner,
	table.td_change_table tbody tr td .inner {
		display: block;
		width: 76%;
	  	
	  	padding: 6px 10px 6px 10px !important;
		line-height: 140%;
	  	
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		
		font-size: 1.5rem !important;
	}
	
	table.td_change_table tbody tr th {
	
	}
	
	table.td_change_table tbody tr th p,
	table.td_change_table tbody tr td p{
		line-height: 140%;
	}
	
	
	
	
	
	/* ---------- 記事内のテーブル設定（レスポンシブさせない） ---------- */
	
	/*tableをスクロールありで表示させる場合、これで囲む　div*/
	.table_scroll_box{
		width: auto !important;
		overflow-x:scroll !important;
	}
	
	.table_scroll_box table {
		margin-bottom: 0.5rem;
		/*
		border-top: #dadada solid 1px !important;
		border-left: #dadada solid 1px !important;
		*/
	}
	
	
	
	/*tableタグにこのclassが指定されているtableの中に入れ子になっているtableから罫線を取る*/
	.table_scroll_box table.td_in_table td table,
	.table_scroll_box table.td_in_table td table th,
	.table_scroll_box table.td_in_table td table tr,
	.table_scroll_box table.td_in_table td table td{
		border: none !important;
		padding: 0px;
	}
	
	.table_scroll_box table.td_in_table th{
		width: 30% !important;
		padding:6px 6px 6px 6px !important;
	}
	
	.table_scroll_box table.td_in_table td{
		padding:6px 6px 6px 6px !important;
	}
	
	.table_scroll_box table.td_in_table td table{
		width: 100% !important;
	}
	
	.table_scroll_box table.td_in_table td table tr{
		border: none !important;
		padding:0px 0px 0px 0px;
		width:100% !important;
	}
	
	.table_scroll_box table.td_in_table td table td{
		border-left: none !important;
		word-wrap: break-word;
		overflow: hidden;
		display: block;
		padding: 0px 0px 0px 0px !important;
		border: none !important;
		width:100% !important;
	}
	
	
	
	table.noline,
	table.noline tr,
	table.noline td,
	table.noline th,
	table:not(.no_responsive_table):not(.table_img_2column):not(.open_searchbox table).noline,
	table:not(.no_responsive_table):not(.table_img_2column):not(.open_searchbox table).noline tr,
	table:not(.no_responsive_table):not(.table_img_2column):not(.open_searchbox table).noline td,
	table:not(.no_responsive_table):not(.table_img_2column):not(.open_searchbox table).noline th{
		border: 0px !important;
		border-top: #e8e8e8 solid 0px !important;
		border-bottom: #e8e8e8 solid 0px !important;
	}
	
	
	
	/* -------------------- 水平線画像 -------------------- */
	
	
	/* ---------- 記事内のグレー罫線の囲み（div） ---------- */
	
	.box_gray,
	.box_green,
	.box_emerald,
	.box_white,
	.box_gray_compact,
	.box_green_compact,
	.box_white_compact,
	.box_gray5,
	.box_green5,
	.box_green3,
	.box_gray10,
	.box_green10,
	.box_gray_beige5,
	.box_bg_gray,
	.box_bg_blue,
	.box_bg_white
 	{
		padding:15px 15px 15px 15px !important;
		box-sizing: border-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-ms-box-sizing: border-box;
	}
	
	/*お問い合わせ先フォーマット（「box_gray_beige5」と同じ）*/
	.contact_info_box {
		padding:15px 15px 15px 15px !important;
		margin:10px 0px 25px 0px;
		border: solid 5px #F3EFE9;
	}
	
	
	.box_gray img,
	.box_green img,
	.box_emerald img,
	.box_white img,
	.box_gray_compact img,
	.box_green_compact img,
	.box_white_compact img,
	.box_gray5 img,
	.box_green5 img,
	.box_green3 img,
	.box_gray10 img,
	.box_green10 img,
	.box_gray_beige5 img {
		width: 100%;
		height: auto !important;
	}
	
	
	/* 背景が薄いグレーのボックス */
	
	.box_bg_gray{
		padding:15px 15px 15px 15px;
	}
	
	.box_bg_beige{
		padding:15px 15px 15px 15px;
	}
	
	
	/*「box_gray_XX」と併記して利用*/
	
	/*inline-blockを追加する*/
	.display_ib{
		overflow: hidden;
		display: inline-block
	}
	
	/*スマホではblock*/
	.sp_display_b{
		display: block !important;
	}
	
	
	/* ---------- 記事内のol ---------- */
	
	ol {
	
	}
	
	ol > li {
	
	}
	
	ol > li > ul {
	
	}
	
	ol > li > ul li {
	
	}
	
	
	
	/* ---------- 記事内のul ---------- */
	
	
 	ul.float{
	
	}
	
 	ul.float li {
	
	}
	
	
	/* ---------- 記事内のア、イ、ウ…のli ---------- */
	
	/* ---------- 記事内の注釈 ---------- */
	
	
	
	/* ---------- div内で2列にならべるdiv ---------- */
	
	/*2列全体　div*/
	.text_box_2column{
		display: block;
		overflow: hidden;
		position: relative;
	}
	
	.text_box_2column h2,
	.text_box_2column h3{
		display: inline-block;
		margin: 0px 0 10px 0;
	}
	
	.text_box_2column p{
	}
	
	.text_box_2column .column_inner{
		display: block;
		overflow: hidden;
		position: relative;
		width: 100% !important;
		margin-right: 0px !important;
		margin-bottom: 10px;
		float: none;
	}
	
	
	/* ---------- div内で3列にならべるdiv ---------- */
	
	/*3列全体　div*/
	.text_box_3column,
	.text_box_3column_narrow,
	.text_box_3column_widthauto{
		display: block;
		overflow: hidden;
		position: relative;
	}
	
	.text_box_3column h2,
	.text_box_3column h3{
		display: inline-block;
		margin: 0px 0 10px 0;
	}
	
	.text_box_3column p{
	}
	
	.text_box_3column_left,/*左*/
	.text_box_3column_center,/*中央*/
	.text_box_3column_right,/*右*/
	.text_box_3column .column_inner,
	.text_box_3column_widthauto .column_inner{
		display: block;
		overflow: hidden;
		position: relative;
		width: 100% !important;
		margin-right: 0px !important;
		margin-bottom: 10px;
		float: none;
	}
	
	.text_box_3column_narrow .column_inner{
		width: 100%;
		margin-right: 0.0%;
	}
	
	.text_box_3column_widthauto .column_inner{
		width: auto;
		margin-right: 0%;
	}
	
	/* ---------- div内で4列にならべるdiv ---------- */
	
	/*4列全体　div*/
	.text_box_4column{
		display: block;
		overflow: hidden;
		position: relative;
	}
	
	.text_box_4column h2,
	.text_box_4column h3{
		display: block;
		margin: 0px 0px 10px 0px !important;
		float:none;
		clear: both;
	}
	
	
	.text_box_4column p{
	}
	
	.text_box_4column_1,
	.text_box_4column_2,
	.text_box_4column_3,
	.text_box_4column_4,
	.text_box_4column .column_inner{
		display: block;
		overflow: hidden;
		position: relative;
		width: 100% !important;
		margin-right: 0px !important;
		margin-bottom: 10px;
		float: none;
	}
	
	
	
	/*2カラム、3カラム、4カラムの中に画像を配置した場合はimgにmargin-bottomを強制的に追加*/
	/*また、trimやtrim_wideで囲まれている場合も同様*/
	.text_box_2column_left img,
	.text_box_2column_right img,
	.text_box_3column_left img,
	.text_box_3column_center img,
	.text_box_3column_right img,
	.text_box_4column_1 img,
	.text_box_4column_2 img,
	.text_box_4column_3 img,
	.text_box_4column_4 img,
	
	.text_box_2column .column_inner img,
	.text_box_3column .column_inner img,
	.text_box_4column .column_inner img,
	
	.text_box_2column_left p.trim,
	.text_box_2column_right p.trim,
	.text_box_3column_left p.trim,
	.text_box_3column_center p.trim,
	.text_box_3column_right p.trim,
	.text_box_4column_1 p.trim,
	.text_box_4column_2 p.trim,
	.text_box_4column_3 p.trim,
	.text_box_4column_4 p.trim,
	
	.text_box_2column .column_inner p.trim,
	.text_box_3column .column_inner p.trim,
	.text_box_4column .column_inner p.trim,
	
	.text_box_2column_left p.trim_wide,
	.text_box_2column_right p.trim_wide,
	.text_box_3column_left p.trim_wide,
	.text_box_3column_center p.trim_wide,
	.text_box_3column_right p.trim_wide,
	.text_box_4column_1 p.trim_wide,
	.text_box_4column_2 p.trim_wide,
	.text_box_4column_3 p.trim_wide,
	.text_box_4column_4 p.trim_wide
	
	.text_box_2column .column_inner p.trim_wide,
	.text_box_3column .column_inner p.trim_wide,
	.text_box_4column .column_inner p.trim_wide
	
	{
		margin-bottom: 10px;
	}
	
	
	/* ----------リンクとダウンロードファイルのアイコン---------- */
	/*aタグ用*/
	
	/*基本リンク*/
	.icon_link:after{
	
	}
	
	.icon_link:hover {
		text-decoration: underline
	}
	
	/*blank*/
	.icon_blank:after{
	
	}
	
	.icon_blank:hover {
		text-decoration: underline
	}
	
	
	/*mail*/
	.icon_mail:after {
	
	}
	
	/*pdf*/
	.icon_pdf:after {
	
	}
	
	/*tel*/
	.icon_tel:after {
	
	}
	
	/*search*/
	.icon_search:after {
	
	}
	
	/*picture_zoom*/
	.icon_picture_zoom:after {
	
	}
	
	
	/*トップページ用「詳しく見る」を囲んだdiv*/
	.link_box{
		display: block;
		position: relative;
		margin-top: 20px;
		margin-bottom: 20px;
		text-align: center;
	}
	
	
	/*基本ボタン（詳しく見る）*/
	.button,
	.button_blue{
		min-width: auto;
		font-size: 1.4rem;
		padding: 9px 3.5vw 9px 3.5vw;
		width: auto;
	}
	
	.button:hover{
		text-decoration: none !important;
	}
	
	
	
	
	
	
	.sp_only {
		display:inline-block !important;
	}
	
	.pc_only {
		display: none !important;
	}
	
	.tablet_only {
		display: none !important;
	}
	
	.print_only {
		display:none;
	}
	
	/*PCの「p」だけマージンボトム20、スマホは0*/
	.pc_only_mb20 {
		margin-bottom:0px !important;
	}
	
	
	
	
	/* --------------------
	スマホ
	ページ内アンカーの飛び先
	
	-------------------- */
	
	.anchor{
		margin-top: -46px;
		padding-top: 46px;
	}
	
	
	
	
	/*--------------------------------
	スマホ
	トップページ専用スタイル
	
	--------------------------------*/
	
	
	/*--------------- トップページのみのスタイル（メインビジュアル） ---------------*/
	
	.mainvisual_area{
		padding-top: 0px;
		margin-bottom: 160px;
	}
	
	.mainvisual_catchcopy_box{
		display: inline-block;
		position: absolute;
		bottom: 100px;
		left: 20px;
		z-index: 2;
	}
	
	.as-panels{
		
	}
	
	.main_visual_img_box1{
	
	}
	
	.main_visual_img_box1 img{

	}
	
	/*img*/
	.as-background{
		
	}
	
	.mainvisual_catchcopy{
		display: inline-block;
		font-family: "Poppins", sans-serif;
		text-align: left;
		font-size: 2.8rem;
		line-height: 1.8;
		letter-spacing: 0.1rem;
		margin-top: 0rem;
		font-weight: 700;
		color:#ffffff;
		text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
		-webkit-transition: all 0.1s ease-in-out;
		-moz-transition: all 0.1s ease-in-out;
		-o-transition: all 0.1s ease-in-out;
		transition: all 0.1s ease-in-out;
	}
	
	.mainvisual_catchcopy span{
		display: inline-block;
		border-bottom: solid 2px #ffffff;
	}


	
	/*--------------- トップページ構成要素の共通パーツ ---------------*/
	
	.frontpage_section_title_box{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
	}
	
	.frontpage_section_title{
		display: block;
		position: relative;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 2.4rem;
		color: #FFFFFF;
		font-weight: 600;
		margin-bottom: 15px;
	}
	
	
	
	/*02お知らせ*/
	.news .frontpage_section_title_box{
	}
	

	.frontpage_section_text{
		font-size: 1.6rem;
	}

	
	/*--------------- トップページの導入部分 ---------------*/
	
	.introduction{
		display: block;
		position: relative;
		margin: 0 auto;
		margin-bottom: 20px;
		padding-left: 20px;
		padding-right: 20px;
		max-width: 1280px;
	}
	
	.mainvisual_catchcopy_english{
		display: inline-block;
		position: absolute;
		margin-top: -180px;
		top: 0;
		left: 20px;
		width: 80%;
		max-width: 860px;
		aspect-ratio: 850 / 400;/*縦横比固定*/
		background: url("../img/frontpage_introduction_title_e.svg") no-repeat left top;
		background-size: contain;
		z-index: 2;
	}
	
	.mainvisual_catchcopy_english span{
		display: none;
	}
	
	.frontpage_introduction_2column {
		display:block;
		
		margin: 0 auto;
		letter-spacing: normal;
	}
	
	.frontpage_introduction_2column .column_inner{
		display: block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		
	}
	
	.frontpage_introduction_2column .column_inner:nth-of-type(1){
		width: 100%;
		padding-top: 0%;
		padding-right: 0%;
		z-index: 3;
	}
	
	.frontpage_introduction_2column .column_inner:nth-of-type(2){
		width: 100%;
	}
	
	.introduction_text{
		display: block;
		position: relative;
		margin-bottom: 20px;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.7rem;
		line-height: 210%;
		font-weight: 600 !important;
		color:#333333;
	}
	
	
	
	/*--------------- トップページの「01事業案内」 ---------------*/
	
	.service{
		display: block;
		position: relative;
		margin: 0 auto;
		padding-top: 50px;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 20px;
		background-image: linear-gradient(90deg, #00a9ea, #006dbc);
		border-top: solid 1px #636363;
	}
	
	.service:before{
		content:"";
		display: block;
		position: relative;
		height: 50px;
		margin: 0 auto;
		margin-left: -20px;
		margin-right: -20px;
		margin-top: -50px;
		margin-bottom: 30px;
		background: url("../img/frontpage_service_title_bg.svg") no-repeat right 0px top;
		background-size: auto 50px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.service:after{
		content:"";
		display: block;
		position: absolute;
		width: 10px;
		height: 10px;
		top: 50px;
		left: 0px;
		background-color: #2494d7;
	}
	
	.service .section_inner{
		display: block;
		position: relative;
		margin: 0 auto;
		max-width: 1280px;
	}
	
	/*01事業案内*/
	.service .frontpage_section_title_box{
		margin-bottom: 70px;
	}
	
	.service .frontpage_section_title{
		
	}
	
	.service .frontpage_section_text{
		color: #FFFFFF;
		font-weight: 600;
	}
	
	.frontpage_service_3column{
		display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
		letter-spacing: -.40em;/* 文字間を詰めて隙間を削除する */
		position: relative;
	}
	
	.frontpage_service_3column .column_inner{
		display: block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		width: 100%;
		margin-right: 0%;
		margin-bottom: calc(4% + 40px);
		display: inline-block;
		position: relative;
		padding: 0px;
		background-color: #ffffff;
		border: solid 1px #636363;
		font-weight: 600;
	}
	
	
	
	.frontpage_service_3column .column_inner:nth-of-type(1n){
	
	}
	
	.frontpage_service_3column .column_inner:nth-of-type(2n){
	
	}
	
	.frontpage_service_3column .column_inner:nth-of-type(3n){
		margin-right: 0%;
	}
	
	.frontpage_service_3column .column_inner:last-of-type{
		margin-top: -20px;
		margin-bottom: 20px;
	}
	
	.frontpage_service_name_e{
		display: inline-block;
		position: absolute;
		height: 30px;
		top:-30px;
		left: -1px;
		padding: 4px 12px 4px 12px;
		background-color: #ffffff;
		border: solid 1px #636363;
		font-weight: 600;
		font-size: 1.2rem;
		margin-bottom: -1px;
		z-index: -1;
	}
	
	.frontpage_service_content{
		
	}
	
	.frontpage_service_img{
		
	}
	.frontpage_service_name{
		padding: 12px 15px 12px 15px;
		border-bottom: dashed 1px #636363;
		font-size: 1.9rem;
	}
	.frontpage_service_text{
		padding: 12px 15px 12px 15px;
		line-height: 140%;
		font-weight: normal;
		font-size: 1.6rem;
	}
	
	.frontpage_service_link{
		height: 100%;
	}
	
	.frontpage_service_link a{
		display: flex; /* 子要素をflexboxで揃える */
		flex-direction: row; /* 子要素をflexboxにより縦並びに揃える */
		justify-content: center; /* 子要素をflexboxにより左右中央に配置する */
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		text-align: center;
		color: #ffffff;
		background-color: #333333;
		height: 100%;
		padding: 14px;
		font-size: 1.8rem;
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.frontpage_service_link a:after{
		content:"";
		display: block;
		position: absolute;
		width: 28px;
		height: 28px;
		background: url("../img/icon_link_white.svg") no-repeat center center;
		background-size: contain;
		margin: 0 auto;
		right: 20px;
		top:calc(50% - 14px);
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.frontpage_service_link a:hover{
		background-color: #494949;
	}
	
	.frontpage_service_link a:hover:after{
		width: 84px;
		height: 84px;
	}
	
	
	
	/*--------------- トップページの「02NEWS」 ---------------*/
	
	.news{
		display: block;
		position: relative;
		margin: 0 auto;
		padding: 60px 0px 0px 0px;
		margin-bottom: 60px;
	}
	
	.news:before{
		content:"";
		display: block;
		position: relative;
		margin: 0 auto;
		margin-left: -20px;
		margin-right: -20px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.news:after{
		content:"";
		display: block;
		position: relative;
		margin: 0 auto;
		margin-left: -20px;
		margin-right: -20px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.news .blue_cube:after{
		content:"";
		display: block;
		position: absolute;
		width: 10px;
		height: 10px;
		top: 60px;
		left: 0px;
		background-color: #2494d7;
	}
	
	.news .section_inner{
		display:block;
		letter-spacing: normal;
		margin: 0 auto;
		max-width: calc(1280px + 70px + 70px);
	}
	
	.news .section_inner .title_box {
		display: block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		width: auto;
		margin-left: -20px;
		margin-right: -20px;
		border-bottom: solid 1px #636363;
	}
	
	.news .section_title{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		padding:14px 40px 14px 40px;
		font-family: "dnp-shuei-mgothic-std", sans-serif;/*ウェイトは400、600*/
		font-size: 1.6rem;
		font-weight: 400;
		margin-bottom: 0px;
		width: 100%;
		max-height: 100px;
	}
	
	.news .section_title img{
		height: 24px;
		width: auto;
	}
	
	.news .section_title span{
		display: none;
	}
	
	.news .section_inner .news_list_box{
		display: block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		width: 100%;
		
		
	}
	
	/*お知らせ1記事分 div*/
	.news_1box{
		display:block;
		position:relative;
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		border-top:solid 1px #d3d3cf;
		overflow: hidden;
		z-index: 1;
	}
	
	.news_1box:first-Child{
		border-top:solid 0px #d3d3cf;
	}
	
	/*1記事毎のくくりに「no_icon」が付いている場合はQとAのアイコンをつけない*/
	.news_1box.no_icon{
		padding-left: 0px;
	}
	
	/* 「記事タイトル欄」の設定 */
	.news_title_box{
		display:block;
		position: relative;
		width: 100%;
		cursor: pointer;
		
		
	}
	
	/*お知らせタイトルのクリック範囲*/
	.news_click_area{
		display:block;
		position:relative;
		box-sizing:border-box;
		width:100%;
		min-height: 2rem;
		margin:0px 0px 0px 0px;
		padding:14px 50px 14px 20px;
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.news_click_area:hover{
		cursor: pointer;
		background-color: #f2f2f2;
	}
	
	.news_click_area.active:hover{
		cursor: pointer;
	
	}
	
	.news_click_area p{
		text-align:left;
		line-height: 160%;
	}
	
	.news_click_area:hover p{
	}
	
	.news_click_area.active p{
	
	}
	
	.news_title_box .date{
		display: inline-block;
		position: relative;
		font-size: 1.5rem;
		color: #2594d7;
		font-weight: 600;
		margin-right: 6px;
		margin-bottom: 5px;
		vertical-align: middle;
		line-height: 100%;
		min-width: 80px;
		width: 100%;
		letter-spacing: normal;
	}
	
	.news_title_box .genre{
		display: inline-block;
		position: relative;
		padding: 1px 5px 1px 5px;
		border: solid 1px #555555;
		font-size: 1.1rem;
		color: #555555;
		margin-right: 3px;
		text-align: center;
		min-width: 70px;
		letter-spacing: normal;
	}
	
	.genre_01,
	.genre_02,
	.genre_03,
	.genre_04,
	.genre_05,
	.genre_06,
	.genre_07,
	.genre_08,
	.genre_09,
	.genre_10{
		
	}
	
	/*
	初期ジャンル
	・お知らせ　　　　　
	・ブログ　　　　
	・事例紹介
	・採用情報
	*/
	
	/*お知らせ*/
	.genre_01{}
	
	/*ブログ*/
	.genre_02{}
	
	/*事例紹介*/
	.genre_03{}
	
	/*採用情報*/
	.genre_04{}
	
	/*予備*/
	.genre_05{}
	
	/*予備*/
	.genre_06{}
	
	/*予備*/
	.genre_07{}
	
	/*予備*/
	.genre_08{}
	
	/*予備*/
	.genre_09{}
	
	/*予備*/
	.genre_10{}
	
	
	.news_title_box .title{
		display: block;
		width: 100%;
		position: relative;
		font-size: 1.6rem;
		font-weight: 500;
		color: #333333;
		vertical-align: middle;
		line-height: 160%;
		letter-spacing: normal;
		padding-right: 0px;
	}
	
	.news_title_box .title.icon_new:after{
		content:"NEW";
		display: inline-block;
		position: relative;
		font-size: 10px;
		color: #ffffff;
		margin-left: 6px;
		margin-top: -2px;
		vertical-align: middle;
		/**/
		background-color: #333333;
		line-height: 100%;
		padding: 2px 2px 2px 2px;
	}
	
	.news_title_box .title a:hover{
		text-decoration: underline;
	}
	
	/* 答えのエリア div */
	.news_contents_box{
		display: none;
		position: relative;
		width:100%;
		margin:0px 0px 14px 0px;
		padding:14px 20px 14px 20px;
		
		opacity: 1;
		animation: answer_triangle_fade 0.5s linear;
		-webkit-animation: answer_triangle_fade 0.5s linear;
		-moz-animation: answer_triangle_fade 0.5s linear;
	}
	
	/*NEWS、FAQ共通利用*/
	.accordion_icon,
	.accordion_icon span {
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
		pointer-events: none;
		z-index: 2;
	}
	.accordion_icon {
		position: absolute;
		right:20px;
		top:calc(50% - 10px);
		width: 24px;
		height: 24px;
		background: url("../img/icon_down.svg") no-repeat center center;
		background-size: contain;
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	
	/*開閉アイコン切り替え*/
	
	.accordion_icon.active {
		transform: rotate(180deg);
	}
	
	.accordion_icon.active span:nth-of-type(1) {
		width: 50%;
		top: 11px;
		left: 6px;
		
		transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		-o-transform: rotate(45deg);
	}
	
	.accordion_icon.active span:nth-of-type(2) {
		width: 50%;
		top: 11px;
		right: 6px;
		
		transform: rotate(135deg);
		-webkit-transform: rotate(135deg);
		-moz-transform: rotate(135deg);
		-ms-transform: rotate(135deg);
		-o-transform: rotate(135deg);
	}
	
	
	
	/*--------------- トップページの「03施工事例」 ---------------*/
	
	.ex{
		display: block;
		position: relative;
		margin: 0 auto;
		background: url("../img/frontpage_ex_bg.jpg") no-repeat center top;
		background-size: cover;
		padding-top: 40px;
		padding-bottom: 40px;
	}
	
	.ex_title_e_box{
		display: block;
		position: relative;
		height: 80px;
		width: 100%;
		border-top: solid 1px color(display-p3 0.318 0.49 0.639);
		border-bottom: solid 1px color(display-p3 0.318 0.49 0.639);
		margin-bottom: 40px;
	}
	
	/*ul*/
	.ex_title_infiniteslide{
	}
	
	.ex_title_infiniteslide li img{
		margin-right: 100px;
		height: 78px;
		width: auto;
	}
	
	.ex .section_inner{
		display: block;
		position: relative;
		margin: 0 auto;
		padding-left: 20px;
		padding-right: 20px;
		max-width: 1520px;
	}
	
	.ex_title_e_box:after{
		content:"";
		display: block;
		position: absolute;
		width: 10px;
		height: 10px;
		bottom: -11px;
		left: 0px;
		background-color: rgba(36, 148, 215, 0.7);
	}
	
	/*03施工事例*/
	.ex .frontpage_section_title_box{
		margin-bottom: 40px;
	}
	
	.ex .frontpage_section_title{
		
	}
	
	.ex .frontpage_section_text{
		color: #FFFFFF;
		font-weight: 600;
		font-size: 1.6rem;
	}
	
	.ex_photo_box{
		margin-bottom: 40px;
	}
	
	/*ul*/
	.ex_photo_infiniteslide{
		
	}
	
	.ex_photo_infiniteslide li img{
		height: 210px;
		width: auto;
	}
	
	
	
	/*div*/
	.ex_link_box{
		margin: 0 auto;
		max-width: 1280px;
		text-align: center;
	}
	
	/*p*/
	.ex_link{
		display: inline-block;
		position: relative;
	}
	
	.ex_link a{
		display: inline-block;
		position: relative;
		width: 100%;
		padding: 14px 70px 14px 70px;
		border: solid 1px #ffffff;
		font-weight: 600;
		font-size: 1.8rem;
		color: #ffffff;
		min-width: 300px;
		width: 36vw;
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.ex_link a:after{
		content:"";
		display: inline-block;
		position: absolute;
		width: 28px;
		height: 28px;
		top:calc(50% - 14px);
		right: 20px;
		background: url("../img/icon_link_white.svg") no-repeat center center;
		background-size: contain;
	}
	
	.ex_link a:hover{
		background-color: rgba(35, 148, 216, 1);
	}
		
	
	
	
	/*--------------- トップページの「04会社概要」 ---------------*/
	
	.company{
		display: block;
		position: relative;
		margin: 0 auto;
		padding: 40px 20px 0px 20px;
		margin-bottom: 40px;
		min-height: 100px;
	}
	
	.company:before{
		content:"";
		display: block;
		position: relative;
		margin: 0 auto;
		margin-left: -20px;
		margin-right: -20px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.company:after{
		content:"";
		display: block;
		position: absolute;
		bottom: 0px;
		right: 5%;
		left:5%;
		width: 90%;
		aspect-ratio: 900 / 160;/*縦横比固定*/
		background: url("../img/frontpage_company_bg_wataru.svg") no-repeat right bottom;
		background-size: contain;
		max-width: 800px;
	}
	
	.company .blue_cube:after{
		content:"";
		display: block;
		position: absolute;
		width: 10px;
		height: 10px;
		top: 41px;
		left: 0px;
		background-color: #2494d7;
	}
	
	/*03会社概要*/
	.company .title_box{
		display: block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		margin-bottom: 20px;
	}
	
	.company .title_box:after{
		content:"";
		display: block;
		position: relative;
		margin: 0 auto;
		margin-left: -20px;
		margin-right: -20px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.company .title_box .title_box_inner{
		display: block;
		position: relative;
		margin: 0 auto;
		max-width: calc(1280px + 70px + 70px);
	}
	
	.company .section_title{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		padding:14px 0px 14px 0px;
		font-family: "dnp-shuei-mgothic-std", sans-serif;/*ウェイトは400、600*/
		font-size: 1.6rem;
		font-weight: 400;
		margin-bottom: 0px;
		max-height: 100px;
	}
	
	.company .section_title img{
		height: 24px;
		width: auto;
	}
	
	.company .section_title span{
		display: none;
	}
	
	.frontpage_section_title_company{
		font-size: 1.9rem;
		margin-bottom: 40px;
	}
	
	.company .section_inner{
		display:block;
		position: relative;
		margin: 0 auto;
		padding-left: 0px;
		padding-right: 0px;
		max-width: calc(1280px + 60px + 60px);
	}
	
	.frontpage_company_2column{
		display:block;
		letter-spacing: normal;
		margin: 0 auto;
		margin-bottom: 40px;
		z-index: 1;
	}
	
	.frontpage_company_2column .column_inner{
		display: block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		width: 100%;
		padding-right: 0%;
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.frontpage_company_2column .column_inner:nth-of-type(2){
		margin-top: 0px;
		width: 100%;
		padding-right: 0%;
	}
	
	.company .frontpage_catchcopy{
		font-size: 2.4rem;
		font-weight: 700;
		margin-bottom: 20px;
	}
	
	.frontpage_company_text{
		font-size: 1.6rem;
		margin-bottom: 30px;
	}
	
	.frontpage_company_link{
		text-align: center;
		margin-bottom: 40px;
	}
	
	.frontpage_company_link a{
		display: inline-block;
		position: relative;
		margin: 0 auto;
		padding:20px 70px 20px 70px;
		min-width: 300px;
		width: auto;
		font-size: 1.8rem;
	}
	
	.frontpage_company_link a:after{
		
	}
	
	.frontpage_company_link a:after{
		content:"";
		display: inline-block;
		position: absolute;
		width: 28px;
		height: 28px;
		top:calc(50% - 14px);
		right: 10px;
		background: url("../img/icon_link_white.svg") no-repeat center center;
		background-size: contain;
	}
	
	.frontpage_company_link a:hover:after{
		content:"";
		display: inline-block;
		position: absolute;
		width: 28px;
		height: 28px;
		top:calc(50% - 14px);
		right: 20px;
		background: url("../img/icon_link_black.svg") no-repeat center center;
		background-size: contain;
	}
	
	.frontpage_company_img{
		max-width: 140px;
		margin: 0 auto;
		text-align: center;
	}
	
	.frontpage_company_img img{
		width: 100%;
	}


	
	
	/*--------------------------------
	
	iOSでの「100vh」が正確じゃない問題の解決
	
	--------------------------------*/
	
	/* Safari用のハックは、Chromeに適用されないようにする */
	
	@supports (-webkit-touch-callout: none) {
		.drawermenu_box,
		.mainvisual_area,
		#mainvisual_box,
		.mainvisual,
		.mainvisual_catchcopy_box{
		/* Safari用のハック */
		/*height: -webkit-fill-available;*/
  	}
	}
	
	
	
	/*--------------------------------
	
	下層ページ共通部分
	
	--------------------------------*/
	
	/*ページタイトル基本形*/
	.page_title_box{
		display: block;
		position: relative;
		text-align: left;
		margin: 0 auto;
		margin-top: 40px;
		padding: 0px 20px 40px 20px;
		border-top: solid 1px #636363;
	}
	
	.page_title_box:after{
		content:"";
		display: block;
		position: absolute;
		width: 10px;
		height: 10px;
		top: 0px;
		left: 0px;
		background-color: #2494d7;
	}
	
	.page_title_inner{
		
	}
	
	/*ページタイトル 英語*/
	.page_title_box .title_english {
		display: block;
		position: relative;
		width: calc(100% + 40px);
		height: 52px;
		padding: 10px 20px 10px 20px;
		border-bottom: solid 1px #636363;
		margin-left: -20px;
		margin-right: -20px;
		margin-bottom: 10px;
	}
	
	.page_title_box .title_english span{
		display: none;
	}
	
	.category_service .page_title_box .title_english {
		background: url("../img/title_service.svg") no-repeat left 20px center;
		background-size: auto 27px;
	}
	
	.category_company .page_title_box .title_english {
		background: url("../img/title_company.svg") no-repeat left 20px center;
		background-size: auto 27px;
	}
	
	.category_ex .page_title_box .title_english {
		background: url("../img/title_example.svg") no-repeat left 20px center;
		background-size: auto 27px;
	}
	
	.category_contact .page_title_box .title_english {
		background: url("../img/title_contact.svg") no-repeat left 20px center;
		background-size: auto 27px;
	}
	
	/*ページタイトル 日本語*/
	.page_title_box .page_title{
		display: block;
		position: relative;
		padding-left: 0px;
		font-size: 2.2rem;
		font-weight: 600;
		line-height: 140%;
	}
	
	.page_title_box .title_text {
	}
	
	.contents_all{
		display: block;
		position: relative;
		padding: 0px 20px 0px 20px;
		margin: 0 auto;
		
	}
	
	.section_inner{
		display: block;
		position: relative;
		margin: 0 auto;
		max-width: 1200px;
	}
	
	/*段落ごとのくくり*/
	.content_box{
		display: block;
		position: relative;
		margin: 0 auto;
		margin-bottom: 50px;
	}
	
	.content_box h3{
		color: #000000;
		font-size: 2.0rem;
		margin-bottom: 30px;
		font-weight: 700;
		/*-webkit-text-stroke-width: 1px;*/
	}
	
	/*段落のタイトル　日本語プラス英語の、罫線があるテンプレート*/
	.section_title_box{
		display: flex;
		position: relative;
		justify-content: flex-start; /*左寄せ（デフォルト）*/
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		margin-left: -20px;
		margin-right:  -20px;
		margin-bottom: 30px;
		border-top: solid 1px #636363;
		border-bottom: solid 1px #636363;
	}
	
	.content_box h3.section_title{
		display: inline-block;
		position: relative;
		padding: 15px 20px 15px 20px;
		margin-bottom: 0px;
		font-size: 2rem;
		font-weight: 500;
		line-height: 100%;
		border-right: solid 1px #636363;
		-webkit-text-stroke-width: 0px;
	}
	
	.section_title_e{
		position: relative;
		color: #000000;
		font-size: 1.6rem;
		font-weight: 500;
		padding-left: 20px;
		line-height: 100%;
	}
	
	.section_title_e:before{
		content:"";
		display: block;
		position: absolute;
		width: 11px;
		height: 11px;
		top: calc(50% - 6px);
		left: calc(0px - 6px);
		background-color: #2494d7;
	}
	
	
	/*--------------------------------
	
	「事業案内」ページ　ディレクトリ：service/
	
	--------------------------------*/
	
	.category_service{
		
	}
	
	.entry_service{
		
	}
	
	.entry_service .main_img_box{
		display: block;
		position: relative;
		margin: 0 auto;
		margin-bottom: 50px;
	}
	
	/*ワタルが選ばれる理由タイトル*/
	.service_reason_title_box{
		display: flex;
		position: relative;
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		background-color: #2391D2;
		padding: 15px 20px 15px 20px;
		margin-left: -20px;
		margin-right:  -20px;
		margin-bottom: 20px;
		border-top: solid 1px #636363;
		border-bottom: solid 1px #636363;
	}
	
	.content_box h3.service_reason_title{
		display: inline-block;
		position: relative;
		width: 100%;
		margin: 0 auto;
		max-width: 1200px;
		color: #ffffff;
		font-weight: 700;
		font-size: 2.2rem;
		text-align: left;
		-webkit-text-stroke-width: 1px;/*太字*/
	}
	
	.service_reason_3column{
		display:block;
		letter-spacing: normal;
		position: relative;
	}
	
	.service_reason_3column .column_inner{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		width: 100%;
		margin-right: 0%;
		margin-bottom: 20px;
		border: solid 1px #636363;
	}
	
	.service_reason_3column .column_inner:nth-of-type(3n){
		margin-right: 0%;
	}
	
	.service_reason_img{
		border-bottom: solid 1px #636363;
	}
	
	.service_reason_catchcopy{
		padding: 15px 15px 15px 15px;
		font-size: 2.0rem;
		font-weight: 700;
		color: #2391D2;
		line-height: 130%;
		border-bottom: solid 1px #636363;
	}
	
	.service_reason_catchcopy br{
		display: none;
	}
	
	.service_reason_text{
		padding: 15px 15px 15px 15px;
		font-size: 1.6rem;
	}
	
	/*事業紹介*/
	.service_about_1box{
		margin-bottom: 40px;
	}
	
	.service_about_column_box{
		display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
		letter-spacing: -.40em;/* 文字間を詰めて隙間を削除する */
		position: relative;
		border: solid 1px #636363;
	}
	
	.service_about_column_box .column_inner{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		width: 100%;
		margin-right: 0%;
		
		order: 2;
	}
	
	.service_about_title_box{
		display: block;
		position: relative;
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		border-bottom: solid 1px #636363;
	}
	
	.service_about_title{
		display: block;
		width: 100%;
		padding: 15px 15px 3px 15px;
		border-right: solid 0px #636363;
		font-size: 2.2rem;
		font-weight: 600;
		line-height: 130%;
	}
	
	.service_about_title_e{
		padding: 0px 15px 15px 15px;
		font-size: 1.3rem;
		font-weight: 600;
		line-height: 130%;
	}
	
	.service_about_tag_box{
		border-bottom: solid 1px #636363;
	}
	
	.service_about_tag_box ul{
		display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		padding: 15px 15px 15px 15px;
	}
	
	.service_about_tag_box ul li{
		font-size: 1.3rem;
		background-color: #333333;
		color: #ffffff;
		padding: 2px 5px 2px 5px;
		margin-right: 3px;
		margin-bottom: 3px;
	}
	
	.service_about_text_box{
		display: flex; /* 子要素をflexboxで揃える */
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		padding: 15px 15px 15px 15px;
	}
	
	.service_about_text{
		font-size: 1.6rem;
	}
	
	.service_about_column_box .column_inner:nth-of-type(2){
		display: flex; /* 子要素をflexboxで揃える */
		flex-direction: column; /* 子要素をflexboxにより縦並びに揃える */
		justify-content: center; /* 子要素をflexboxにより左右中央に配置する */
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		width: 100%;
		margin-right: 0%;
		order: 1;
	}
	
	.service_about_img{
		width: 100%;
		height: 100%;
		border-left: solid 0px #636363;
	}
	
	.service_about_img img{
		width:100%;
		height: 100%;
		object-fit: cover; /* この一行を追加するだけ！ */
	}
	
	/*--------------------------------
	
	「会社概要」ページ　ディレクトリ：company/
	
	--------------------------------*/
	
	.category_company{
		
	}
	
	.entry_company{
		
	}
	
	.entry_company .main_img_box{
		display: block;
		position: relative;
		margin: 0 auto;
		margin-bottom: 100px;
	}
	
	
	
	/*--------------------------------
	
	「施工事例」ページ　ディレクトリ：ex/
	
	--------------------------------*/
	
	.category_ex{
		
	}
	
	.entry_ex{
		
	}
	
	.ex_column{
		display:-webkit-box; display:-moz-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:flex; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap;
		letter-spacing: -.40em;
		font-size: 0px;
		border-top: solid 5px #282828;
		border-bottom: solid 5px #282828;
	}
	
	.ex_column .column_inner{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		width: 100%;
		aspect-ratio: 1 / 1;/*縦横比固定*/
		border-right: dotted 0px #282828;
		border-bottom: dotted 1px #282828;
		
		cursor: zoom-in;
	}
	
	.ex_column .column_inner:nth-of-type(3n) {
		border-right: dotted 0px #282828;
	}
	
	.ex_column .column_inner:last-of-type {
		border-bottom: dotted 0px #282828;
	}
	
	/*p*/
	.ex_name{
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		padding: 12px 12px 12px 12px;
		color: #282828;
		font-size: 1.60rem;
		font-weight: 600;
		line-height: 1.3;
		z-index: 1;
		background-color: rgba(255, 255, 255, 0.5);
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.ex_column .column_inner:hover .ex_name{
		color: #ffffff;
		background-color: rgba(0,0,0, 0.2)
	}
	
	.ex_column .column_inner a{
		display: flex;
		position: absolute;
		top: 0%;
		left: 0%;
		right: 0%;
		bottom: 0%;
		
		cursor: zoom-in;
	}
	
	.ex_photo{
		display: flex;
		position: absolute;
		
		flex-direction: column; /* 子要素をflexboxにより縦並びに揃える */
		justify-content: center; /* 子要素をflexboxにより左右中央に配置する */
		align-items: center;  /* 子要素をflexboxにより上下中央に配置する*/
		top: 0%;
		left: 0%;
		right: 0%;
		bottom: 0%;
		
		
	}
	
	.ex_column .column_inner .ex_photo img{
		display: flex;
		position: relative;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	
	.ex_column .column_inner a:hover .ex_photo img{
		opacity: 1;
	}
	
	.ex_photo:after{
		content:"";
		display: flex;
		position: absolute;
		top: 0%;
		left: 0%;
		right: 0%;
		bottom: 0%;
		border-top: solid 46px #ffffff;
		border-left: solid 46px #ffffff;
		border-right: solid 46px #ffffff;
		border-bottom: solid 54px #ffffff;
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.ex_column .column_inner:hover .ex_photo:after{
		border: solid 0px #ffffff;
	}
	
	
	/*ズーム画像の虫眼鏡アイコン*/
	.icon_zoom{
		display: block;
		position: relative;
		cursor: zoom-in;
	}
	
	/**/
	.icon_zoom:after {
		content:"";
		font-family: "Material Symbols Outlined";
		content: "\e8ff";
		display: flex; /* 子要素をflexboxで揃える */
		flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
		justify-content: center; /* 子要素をflexboxにより中央に配置する */
		align-items: center;
		position: absolute;
		right: 10px;
		bottom: 10px;
		width: 36px;
		height: 36px;
		font-size: 24px;
		font-weight: 400;
		vertical-align: middle;
		line-height: normal;
		color: #666666;
		border: solid 0px #ffffff;
		background-color: rgba(255, 255, 255, 0.5);
		
		border-radius: 36px;
		-webkit-border-radius: 36px;
		-ms-border-radius: 36px;
		-moz-border-radius: 36px;
		-o-border-radius: 36px;
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	a.icon_zoom:hover:after {
		right: 8px;
		bottom: 8px;
		width: 40px;
		height: 40px;
		
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	/*ul*/
	.ex_tag_list{
		display: block;
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		padding: 12px 12px 12px 12px;
		
		
		z-index: 1;
	}
	
	.ex_tag_list li{
		display: inline-block;
		position: relative;
		margin-right: 3px;
		padding: 2px 5px 2px 5px;
		border: dotted 1px #767676;
		background-color: rgba(255, 255, 255, 0.9);
		font-size: 1.3rem;
		color: #767676;
		border-radius: 20px;
		-webkit-border-radius: 20px;
		-moz-border-radius: 20px;
	}
	
	.ex_tag_list li:before{
		content:"#";
	}
	
	.ex_column .column_inner:hover .ex_tag_list{
		color: #ffffff;
	}
	
	
	/*--------------------------------
	スマホ
	「お問い合わせ」ページ　ディレクトリ：contact/
		
	--------------------------------*/
	
	.contact{

	}
	
	.contact .section_inner{
		display: block;
		position: relative;
		padding-left: 60px;
		padding-right: 60px;
	}
	
	.contact .section_inner .title_box{

		
	}
	
	.contact .section_inner .title_box .title_english{

	}
	
	.contact_content_box,
	.category_contact .content_box{
		
	}
	
	/*トップページのお問い合わせ欄*/
	.contact_content_box{

	}
	
	/*お問い合わせページのみ*/
	.category_contact .content_box{

	}
	

	/*--------------------------------
	スマホ
	「お知らせ」ページ　ディレクトリ：news　※独立ページとして設置するかどうか未定
	
	--------------------------------*/
	
	
	/*--------------------------------
	スマホ
	「404 Not found」ページ　ディレクトリ：404
	
	--------------------------------*/
	
	.box_404{

	}



}/*@media screen and ( max-width: 768px )ここまで*/




/*プリント用調整（PC画面をA4に最適化）*/
@page {
	/*margin: 10mm 10mm !important;*/
}/*@pageここまで*/

@media print {

	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, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
		/*zoom: 0.99;*/
	}
	
	html{
		font-size: 50%;
	}
	
	html, body{
		overflow: visible !important;
		/*zoom: 0.9;*/
	}
	
	body{
		background-color: #ffffff !important;
		width: 100% !important;
		box-sizing: border-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-ms-box-sizing: border-box;
	}
	
	body:before,
	body:after {
		content:none;
	}
	
	body:before {
		content:none;
	}
	
	
	h1, h2, h3, h4, h5, h6 p{
	}


	/* -------------------------------- 
	
 	レイアウト設定
 	
	-------------------------------- */
	
	/*大枠の構成
		#top　ページトップアンカー
		.header　ヘッダー
		.drawermenu　グランドメニュー
		.contents_all　コンテンツ
		.topicpath_area　パンくず
		.footer　フッター
	*/
	
	/* --------------------
	
	ページトップアンカー
	
	-------------------- */
	
	/* --------------------
	
	ヘッダー
	
	-------------------- */
	
	#header,
	.header{
		position: relative;
		background-color: #ffffff;
		top:0px;
		height: 64px;
	}
	
	.header_inner{
		height: 64px;
	}
	

	.header_menu{
		right: 0px;
		zoom: 0.8;
	}
	
	.btn_logo {
		left: 10px;
		width: 148px;
		height: 64px;
	}
	
	.btn_logo a,
	.frontpage .btn_logo p{
		display: block;
		position: relative;
		width: 148px;
		height: 64px;
		background: url(../img/logo_horizontal.svg) no-repeat center center;
		background-size: 148px 50px;
	}
	
	.frontpage .btn_logo p{
		background: url(../img/logo_horizontal.svg) no-repeat center center;
		background-size: 148px 50px;
	}
	
	/* --------------------
	
	グランドメニュー（ドロワーメニュー）
	
	-------------------- */
	
	.btn_drawermenu{
		display: none;
	}
	
	/* -------------------------------- 
	
 	コンテンツ欄
 	
	-------------------------------- */
	
	.anker{
		margin-top:0px;
		padding-top: 0px;
	}
	
	
	/*googleマップ配置欄　div*/
	.map_box{
		display: block;
		position: relative;
		width: 100%;
		height: auto !important;
		padding-bottom: 0px !important;
		margin: 0 auto;
	}
	
	
	.map_box iframe,
	.map_box object,
	.map_box embed {
		display: block;
		position: relative;
		top: auto;
		left: auto;
		width: 100%;
		height: 300px;
	}
	
	
	
	
	/* -------------------------------- 
	
 	パララックス設定
	
	-------------------------------- */
	
	.animation_1,
	.animation_2,
	.animation_3,
	.fadeInUp,
	.fadeIn,
	.fadeInBlur,
	.fadeInBlur_For3sec,
	.slideShutter {
		overflow: visible !important;
		opacity: 1 !important;
		filter: blur(0px);
		-webkit-filter: blur(0px);
	}
	
	
	/*------------------------------
	
	フッター
	
	------------------------------*/
	
	#footer{
		padding: 0px 0px 0px 0px;
	}
	
	.footer_company{
		display: block;
		width: 100%;
	}
	
	/* ----------ページTOPへボタン---------- */
	#pagetop_wrapper {
		display: none !important;
	}
	
	/*コピーライト*/
	.footer_copyright{

	}
	
	.footer_copyright_inner{

	}
	
	

	
	
	
	/*--------------------------------
	プリント
	トップページ専用スタイル
	
	--------------------------------*/
	
	/*--------------- トップページのみのスタイル（メインビジュアル） ---------------*/
	
	/*section*/
	.mainvisual_area{
		width: 100vw !important;
		padding-top: 0px !important;
		margin-bottom: 100px;
	}
	
	.accordion-slider{
		width: 100vw !important;
		max-height: auto !important;
		min-height: 400px !important;
	}
	
	.mainvisual_box{
		width: 100vw !important;
		max-height: auto;
		min-height: 400px !important;
		overflow: hidden;
	}
	
	.as-mask,
	.as-panels{
		width: 100vw !important;
	}
	
	.mainvisual_catchcopy_box{
		display: inline-block;
		position: absolute;
		bottom: 150px;
		left: 20px;
		z-index: 2;
	}
	
	.mainvisual_catchcopy{
		
	}
	
	/*--------------- トップページ構成要素の共通パーツ ---------------*/
	
	.frontpage_section_title_box{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
	}
	
	.frontpage_section_title{
		display: block;
		position: relative;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 3.0rem;
		color: #FFFFFF;
		font-weight: 600;
		margin-bottom: 30px;
	}
	
	
	
	/*02お知らせ*/
	.news .frontpage_section_title_box{
	}
	

	.frontpage_section_text{
		font-size: 1.7rem;
	}
	
	/*--------------- トップページの導入部分 ---------------*/
	
	.introduction{
		display: block;
		position: relative;
		margin: 0 auto;
		margin-bottom: 80px;
		padding-left: 0px;
		padding-right: 0px;
		max-width: 1280px;
	}
	
	.mainvisual_catchcopy_english{
		display: inline-block;
		position: absolute;
		margin-top: -120px;
		top: 0;
		left: 20px;
		width: 65%;
		max-width: 860px;
		aspect-ratio: 850 / 400;/*縦横比固定*/
		background: url("../img/frontpage_introduction_title_e.svg") no-repeat left top;
		background-size: contain;
		z-index: 2;
	}
	
	/*--------------- トップページの「01事業案内」 ---------------*/
	
	.service{
		padding-top: 75px;
		padding-left: 20px;
		padding-right: 20px;
	}
	
	.service:before{
		content:"";
		display: block;
		position: relative;
		height: 75px;
		margin: 0 auto;
		margin-left: -20px;
		margin-right: -20px;
		margin-top: -75px;
		margin-bottom: 60px;
		background: url("../img/frontpage_service_title_bg.svg") no-repeat right 0px top;
		background-size: auto 75px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.service:after{
		top: 75px;
		left: 0px;
	}
	
	/*--------------- トップページの「02NEWS」 ---------------*/
	
	.news{
		display: block;
		position: relative;
		margin: 0 auto;
		padding: 60px 20px 0px 20px;
		margin-bottom: 60px;
	}
	
	.news:before{
		content:"";
		display: block;
		position: relative;
		margin: 0 auto;
		margin-left: -20px;
		margin-right: -20px;
		background-size: auto 150px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.news:after{
		content:"";
		display: block;
		position: relative;
		margin: 0 auto;
		margin-left: -20px;
		margin-right: -20px;
		background-size: auto 150px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.blue_cube:after{
		content:"";
		display: block;
		position: absolute;
		width: 36px;
		height: 36px;
		top: 60px;
		left: 0px;
		background-color: #2494d7;
	}
	
	.news .section_inner .title_box {
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		width: 200px;
	}
	
	.news .section_title{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		padding:15px 15px 15px 40px;
		font-family: "dnp-shuei-mgothic-std", sans-serif;/*ウェイトは400、600*/
		font-size: 1.6rem;
		font-weight: 400;
		margin-bottom: 0px;
		width: 200px;
		max-height: 100px;
	}
	
	.news .section_title img{
		height: 38px;
		width: auto;
	}
	
	.news .section_inner .news_list_box{
		width: calc(100% - 200px);	
	}
	
	/*--------------- トップページの「03施工事例」 ---------------*/
	
	.ex{
		display: block;
		position: relative;
		margin: 0 auto;
		background: url("../img/frontpage_ex_bg.jpg") no-repeat center top;
		background-size: cover;
		padding-top: 50px;
		padding-bottom: 50px;
	}
	
	.ex_title_e_box{
		display: inline-block;
		position: relative;
		height: 80px;
		border-top: solid 1px color(display-p3 0.318 0.49 0.639);
		border-bottom: solid 1px color(display-p3 0.318 0.49 0.639);
		margin-bottom: 60px;
	}
	
	/*ul*/
	.ex_title_infiniteslide{
		
	}
	
	.ex_title_infiniteslide li img{
		margin-right: 100px;
		height: 79px;
	}
	
	.ex .section_inner{
		display: block;
		position: relative;
		margin: 0 auto;
		padding-left: 20px;
		padding-right: 20px;
		max-width: 1520px;
	}
	
	.ex_title_e_box:after{
		content:"";
		display: block;
		position: absolute;
		width: 36px;
		height: 36px;
		bottom: -37px;
		left: 0px;
		background-color: rgba(36, 148, 215, 0.7);
	}
	
	/*--------------- トップページの「04会社概要」 ---------------*/
	
	.company{
		display: block;
		position: relative;
		margin: 0 auto;
		padding: 60px 0px 0px 0px;
		margin-bottom: 100px;
		min-height: 600px;
	}
	
	.company:before{
		content:"";
		display: block;
		position: relative;
		margin: 0 auto;
		margin-left: 0px;
		margin-right: 0px;
		background-size: auto 75px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.company:after{
		content:"";
		display: block;
		position: absolute;
		bottom: 0px;
		right: 61px;
		width: 54%;
		aspect-ratio: 900 / 160;/*縦横比固定*/
		background: url("../img/frontpage_company_bg_wataru.svg") no-repeat right bottom;
		background-size: contain;
		max-width: 800px;
	}
	
	.blue_cube:after{
		content:"";
		display: block;
		position: absolute;
		width: 36px;
		height: 36px;
		top: 60px;
		left: 0px;
		background-color: #2494d7;
	}
	
	/*03会社概要*/
	.company .title_box{
		display: block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		margin-bottom: 20px;
	}
	
	.company .title_box:after{
		content:"";
		display: block;
		position: relative;
		margin: 0 auto;
		margin-left: 0px;
		margin-right: 0px;
		background-size: auto 150px;
		border-bottom: solid 1px #636363;
		z-index: 1;
	}
	
	.company .title_box .title_box_inner{
		display: block;
		position: relative;
		margin: 0 auto;
		max-width: calc(1280px + 70px + 70px);
	}
	
	.company .section_title{
		display: inline-block;
		position: relative;
		vertical-align: top;
		letter-spacing: normal;
		padding:15px 15px 15px 60px;
		font-family: "dnp-shuei-mgothic-std", sans-serif;/*ウェイトは400、600*/
		font-size: 1.6rem;
		font-weight: 400;
		margin-bottom: 0px;
		max-height: 100px;
	}
	
	.company .section_title img{
		height: 38px;
		width: auto;
	}
	
	.company .section_title span{
		display: none;
	}
	
	.frontpage_section_title_company{
		font-size: 2.2rem;
		margin-bottom: 60px;
	}
	
	.company .section_inner{
		display:block;
		position: relative;
		margin: 0 auto;
		padding-left: 0px;
		padding-right: 0px;
		max-width: calc(1280px + 60px + 60px);
	}
	
	/*--------------------------------
	
	下層ページ共通部分
	
	--------------------------------*/
	
	/*ページタイトル基本形*/
	.page_title_box{
		display: block;
		position: relative;
		text-align: left;
		margin: 0 auto;
		margin-top: 40px;
		padding: 0px 0px 80px 0px;
		border-top: solid 1px #636363;
	}
	
	.page_title_box:after{
		content:"";
		display: block;
		position: absolute;
		width: 36px;
		height: 36px;
		top: 0px;
		left: 0px;
		background-color: #2494d7;
	}
	
	.page_title_inner{
		
	}
	
	/*ページタイトル 英語*/
	.page_title_box .title_english {
		display: inline-block;
		position: relative;
		width: 100%;
		height: 104px;
		padding: 15px 15px 15px 60px;
		border-bottom: solid 1px #636363;
		margin-bottom: 10px;
	}
	
	.page_title_box .title_english span{
		display: none;
	}
	
	.category_service .page_title_box .title_english {
		background: url("../img/title_service.svg") no-repeat left 60px center;
		background-size: auto 38px;
	}
	
	.category_company .page_title_box .title_english {
		background: url("../img/title_company.svg") no-repeat left 60px center;
		background-size: auto 38px;
	}
	
	.category_ex .page_title_box .title_english {
		background: url("../img/title_example.svg") no-repeat left 60px center;
		background-size: auto 38px;
	}
	
	.category_contact .page_title_box .title_english {
		background: url("../img/title_contact.svg") no-repeat left 60px center;
		background-size: auto 38px;
	}
	
	.contents_all{
		display: block;
		position: relative;
		padding: 0px 20px 0px 20px;
		margin: 0 auto;
		
	}
	
	
	


}/*@media printここまで*/



