// スタイルシート common

@charset "utf-8";

@import "mixin";

body{
	@include root;
	position: relative;
}

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

a:hover {
	opacity: .75;
}

$tablet_width: 890;
$smartphone_width: 560;

$zindex_contact: 13;
$zindex_header: 1;
$zindex_gnavtoggle: 100;

$smartphone_gnav: 600;




div#wrapper {
}

// ------------------------------------------------

div#header {
	background-color:$themecolor;
	color:$themetextcolor;
	z-index:10;
	position:fixed;
	top:0;
	@include fixed_top_adminbar_exists(0);
	width:100%;
	& > div.container {
		@include container(1072, 0);
		display:flex;
		justify-content:space-between;
		align-items: center;
		height:58px;
	}
}

$sp_header_threshold1: 500;

div#headerLogo {
	h1 {
		a {
			img {
				margin-left:10px;
				width: 235px;
				@include maxwidth($sp_header_threshold1){
					width: 150px;
				}
			}
		}
	}
}
div#headerContact {
	div.container {
		a {
			display:flex;
			align-items: center;
			div.heading {
				img {
					width: 21px;
					margin-bottom: 2px;
					margin-right: 15px;
					@include maxwidth($sp_header_threshold1){
						margin-right: 5px;
						width: 12px;
					}
				}
			}
			div.body {
				div.tel {
					@include ff_en;
					@include f_all(17, 40, "");
					@include maxwidth($sp_header_threshold1){
						@include f_all(13);
					}
				}
				margin-right: 66px;
				@include maxwidth($sp_header_threshold1){
					margin-right: 56px;
				}
			}
		}
	}
}
div#gnav {
	transform: scale(0);
	body.menu_open & {
		transform: scale(1);
	}
	position:fixed;
	top:0;
	@include fixed_top_adminbar_exists(0);
	bottom:0;
	left:0;
	right:0;
	background-color: rgba(#000, .7);
	z-index: 10;
	div.container {
		height:100%;
		ul {
			background-color:$themetextcolor;
			color:$themecolor;
			transform: translateX(-300px);
			transition: .25s;
			height:100%;
			overflow-y: auto;
			body.menu_open & {
				transform: translateX(0);
			}
			width: 300px;
			max-width: 100%;
			padding-top: 90px;
			box-sizing:border-box;
			li {
				a {
					display:block;
					padding: 1.2em .5em;
					text-align:center;
				}
			}
		}
	}
}

// ------------------------------------------------

div#mainVisual {
	margin-top: 58px;

	div.container {
		@include container(1440, 0);
		div.slides {
			p {
				width: 100%;
				height: 702px;
				@include maxwidth($smartphone_width){
					height: 480px;
				}
				body.subpage &{
					height: 443px;
					@include maxwidth($smartphone_width){
						height: 250px;
					}
					img {
						width:100%;
						height: 100%;
						object-fit: cover;
					}
				}
				//img {
				//	width:100%;
				//	height: 100%;
				//	object-fit: cover;
				//}
			}
		}
		div.overlay {
			pointer-events: none;
			@include flex_centering;
			height:100%;
			width:100%;
			position:absolute;
			left:0;
			top:0;
			p {
				@include absolute_centering;
				@include flex_centering;
				height:100%;
				width:282px;
				background-color:rgba(#000,.48);
				@include maxwidth($smartphone_width){
					width: 150px;
				}
				img {
					width:128px;
					@include maxwidth($smartphone_width){
						width: 60%;
					}
				}
				body.subpage &{
					width:436px;
					@include maxwidth($tablet_width){
						width: 50%;
						min-width: 200px;
					}
					img{
						width: 369.76px;
						@include maxwidth($tablet_width){
							width: 80%;
							min-width: 150px;
						}
					}
				}
			}
		}
	}
}

div#toBelow {
	background-color:$themecolor;
	color:$themetextcolor;
	div.container {
		text-align:center;
		padding: 15.4px 0 16.4px;
		p {
			a {
				img {
					width: 31px;
				}
			}
		}
	}
}

div#subpageTopicPath {
	div.container {
		@include container(1150, 20);
		ul {
			@include f_all(14, "", 21);
			display: flex;
			li {
				padding: 17px 0 39px;
				&::before{
					content: ">";
					padding: 0 1em;
					@include maxwidth($smartphone_width){
						padding: 0 0.25em;
					}
				}
				&:first-child::before{
					content: none;
				}
				a {
					@include maxwidth($smartphone_width){
						font-size: 11px;
					}
				}
			}
		}
	}
}
// ------------------------------------------------

div#content {
}

div#toppageConcept {
	padding-top:80px;
	div.container {
		display:flex;
		@include container(1025, 20);
			@include maxwidth($tablet_width){
				display: block;
				text-align: center;
			}
		& > div {
			margin-bottom: 80px;
			&:first-child{
				@include maxwidth($tablet_width){
					margin-bottom: 50px;
				}
			}
		}
		div.area1 {
			flex: 0 1 587px;
			p {
				img {
					@include maxwidth($tablet_width){
						margin-left: auto;
						margin-right: auto;
					}
				}
			}
		}
		div.area2 {
			flex: 0 1 438px;
			@include maxwidth(1025){
				margin-left: 20px;
			}
			@include maxwidth($tablet_width){
				margin-right: 20px;
			}
			@include maxwidth($smartphone_width){
				margin: 0;
			}
			& > p:first-child{
				text-align: left;
			}
			p {
				@include f_all(12, "", 34);
				margin-bottom:20px;
				@include maxwidth($smartphone_width){
					@include f_all(12, "", 30);	
				}
			}
			h3 {
				margin-bottom: 36px;
				img {
				}
			}
			a {
				padding:7px 39px 6px 34px;
				background-color: $themecolor;
				color: $themetextcolor;
				@include f_all(12, "", 48);
				border-radius: 25px;
			}
		}
	}
}
/*============================
#toppageBusiness
============================*/
div#toppageBusiness {
	background-color: #FFF;
	div.container {
		@include container(1440,0);
		div.area1 {
			background:url(../images/toppage-business-bg-01.jpg) center center / 1440px auto no-repeat;
			img{
				width: 406.68px;
			}
			div.nav {
				flex: 0 1 465px;
				& > ul:first-of-type{
					margin-bottom: 46px;
					@include maxwidth($tablet_width){
						margin-bottom: 15px;
					}
				}
			}
		}
		div.area2 {
			background:url(../images/toppage-business-bg-02.jpg) center center / 1440px auto no-repeat;
			img{
				width: 371.93px;
			}
			div.nav {
				flex: 0 1 391px;
				li{
					margin-bottom: 25px;
				}
			}
		}
		div.body{
			height: 441px;
			display: flex;
			& > div{
				margin-top: 72px;
				@include maxwidth($tablet_width){
					margin-top: 0px;
				}
			}
				@include maxwidth(1200){
					background-size: cover;
				}
				@include maxwidth($tablet_width){
					display: block;
					height: auto;
				}
			div.heading {
				flex: 0 1 727px;
				margin-right: 33px;
				background-color: rgba(0,0,0,.48);
				height: 318px;
				@include maxwidth(1200){
					flex: 0 1 55%;
				}
				@include maxwidth($tablet_width){
					margin-right: 0;
					height: auto;
				}
				div.title{
					margin-left: 226px;
					margin-top: 39.7px;
					@include maxwidth(1200){
						width: 380px;
						margin-right: auto;
						margin-left: auto;
					}
					@include maxwidth($tablet_width){
						margin-top: 0;
						padding: 20px 0 20px;

					}
					@include maxwidth($smartphone_width){
						width: auto;
						margin-right: 20px;
						margin-left: 20px;
					}
					h4 {
						margin-bottom: 38px;
						@include maxwidth($tablet_width){
							margin-bottom: 20px;
						}
						@include maxwidth($smartphone_width){
							// text-align: center;
						}
						img{
							@include maxwidth(1200){
								text-align: center;
							}
							@include maxwidth($tablet_width){
								height: 100px;
								width: auto;
							}
							@include maxwidth($smartphone_width){
								height: 80px;
							}
						}
					}
					p {
						color: $themetextcolor;
						@include f_all(12, "", 21);
						width: 315px;
						@include maxwidth(1200){
							width: 100%;
						}
					}
				}
			}
			div.nav {
				@include maxwidth($tablet_width){
					margin-right: 20px;
					margin-left: 20px;
					padding: 20px 0 15px;
				}
				@include maxwidth($smartphone_width){
					margin-right: 5px;
					margin-left: 5px;
				}	
				ul {
					display: flex;
					flex-wrap: wrap;
					@include maxwidth($tablet_width){
						justify-content: center;
						align-items: center;
						
					}
					li {
						margin-right: 15px;
							@include maxwidth($tablet_width){
								// margin-bottom: 10px;
								margin: 0 1% 10px;
							}
						a {
						color: $basetextcolor;
						background-color: $basecolor;
						@include f_all(12, "", 48);
						border-radius: 25px;
						text-align: center;
						padding: 7px 18px 6px 16px;
							@include maxwidth($tablet_width){
								@include f_all(12, "", 36);
							}
						}
					}
				}
			}
		}
	}
}

/*============================
#toppageWorks
============================*/
div#toppageWorks {
	div.container {
		@include container(1044,10);
		padding-top: 66.7px;
		padding-bottom: 71.7px;
		div.heading {
			margin-left: 28px;
			margin-bottom: 45.3px;
			@include maxwidth($smartphone_width){
				margin-left: 10px;
				margin-bottom: 30px;
			}
			h4 {
				img {
					width: 302.12px;
					@include maxwidth($tablet_width){
						height: 100px;
						width: auto;
					}
					@include maxwidth($smartphone_width){
						height: 80px;
					}
				}
			}
		}
		div.nav {
			@include container(982,0);
			display: flex;
			//justify-content: space-between;
			margin-bottom: 45px;
			@include maxwidth(1025){
				display: block;
			}
			ul {
				display: flex;
				li {
					a {
						@include f_all(12, "", 48);
						border: 1px solid #707070;
						border-radius: 25px;
						padding: 7px 16px 6px;
						@include maxwidth($smartphone_width){
							@include f_all(12, "", 47); 
						}
						&.current {
							background-color: $themecolor;
							color: $themetextcolor; 
							border-color: $themecolor;
						}
					}
				}
			}
			ul.item1{
				flex: 0 1 118px;
				flex-wrap: wrap;
				margin-right: 19px;
				@include maxwidth(1025){
					margin-right: 0;
					margin-left: 10px;
					// justify-content: center;
				}
			}
			ul.item2{
				flex: 0 1 845px;
				flex-wrap: wrap;
				//justify-content: space-between;
				@include maxwidth(1025){
					justify-content: flex-start;
				}
				li{
					margin-right: 13px;
					@include maxwidth(1025){
						margin: 0 1% 0;
					}
				}
			}
		}
		div.body {
			display: flex;
			@include maxwidth($smartphone_width){
				display: block;
				text-align: center;
			}
			ul.main{
				flex: 0 1 50%;
				@include maxwidth(1064){
					flex: 0 1 49.5%;
					margin-right: 0.5%;
				}
				@include maxwidth($smartphone_width){
					flex: 0 1 47%;
					margin-bottom: 10px;
					margin-right: 1.5%;
					margin-left: 1.5%;
				}
				li {
					a {
					}
					img {
						width: 515px;
					}
				}
			}
			ul.sub {
				flex: 0 1 50%;		
				display: flex;
				flex-wrap: wrap;
				align-content: space-between;
				@include maxwidth($smartphone_width){
					justify-content: center;
				}
				li {
					flex: 0 1 251px; 
					&:nth-child(odd){
						margin-left: 7px;
						margin-right: 6px;
						@include maxwidth(1064){
							margin: 0 0.5% 0;
						}
						@include maxwidth($smartphone_width){
							margin: 0 1% 0 0.5%;
						}
					}
					&:nth-child(even){
						margin-left: 7px;
						@include maxwidth(1064){
							margin-left: 0.5%;
						}
						@include maxwidth($smartphone_width){
							margin: 0 0.5% 0 1%;
						}
					}					
					@include maxwidth(1064){
						flex: 0 1 49%;
					}
					@include maxwidth($smartphone_width){
						flex: 0 1 47%;
						padding-bottom: 10px;
					}
					a {
						display: block;
					}
					img {
					}
				}
			}

			ul.sub2 {
				flex: 0 1 100%;		
				display: flex;
				flex-wrap: wrap;
				align-content: space-between;
				//@include maxwidth($smartphone_width){
				//	justify-content: center;
				//}
				li {
					flex: 0 1 248px; 
					margin-left: 7px;
					margin-right: 6px;
					margin-bottom: 14px;
					//@include maxwidth(1064){
					//	margin: 0 0.5% 0;
					//}
					@include maxwidth($smartphone_width){
						margin: 0 1% 0 0.5%;
					}

					//@include maxwidth(1064){
					//	flex: 0 1 49%;
					//}
					@include maxwidth($smartphone_width){
						flex: 0 1 47%;
						padding-bottom: 3%;
					}
					a {
						display: block;
						img {
						}
					}
				}
			}

		}
	}
}

div#toppageInformation {
	margin-bottom: 80px;
	div.container {
		@include container(988, 20);
		div.heading {
			margin-bottom: 40px;
			@include maxwidth($tablet_width){
				margin-bottom: 20px;
			}
			img {
				width: 302px;
				@include maxwidth($tablet_width){
					height: 100px;
					width: auto;
				}
				@include maxwidth($smartphone_width){
					height: 80px;
				}
			}
		}
		div.body {
			&.informationHeadline {}
		}
	}
}

div#toppageVideo {
	margin-bottom: 80px;
	div.container {
		@include container(988, 20);
		div.body {
		}
	}
}

// ------------------------------------------------

div#contentFooter {
}

div#contentFooterCompany {
	div.container {
		@include container(1440,0);
		display: flex;
		@include maxwidth($tablet_width){
			flex-wrap: wrap;
			justify-content: space-between;
		}
		@include maxwidth($smartphone_width){
			display: block;
		}
		div.area{
			@include maxwidth($tablet_width){
				flex: 0 1 50%;
			}
			@include maxwidth($smartphone_width){
				width: 100%;
			}
		}
		div.area1{
			flex: 0 1 100%;
			@include maxwidth($tablet_width){
				flex: 0 1 100%;
			}
			background:url(../images/contentfooter-company-01.jpg) center/ cover no-repeat;
			//width: 480.02px;
			position: relative;
			@include maxwidth($tablet_width){
				height: 34.2vw; 
				height: 45vw; 
			}
			@include maxwidth($smartphone_width){
				height: 68.4vw;
				width: 100%;
			}
			&::before{
			background-color: rgba(0,0,0,0.49);
			position: absolute;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
			content: '';
			}
			a{
				display: block;
				div.item{
					@include absolute_centering;
					@include f_all(18,"",27);
					font-weight: bold;
					color: $themetextcolor;	
					@include flex_centering;
					flex-direction: column;
					@include maxwidth(1200){
						font-size: 14px;
					}
					@include maxwidth($tablet_width){
						font-size: 18px;
					}
					@include maxwidth($smartphone_width){
						font-size: 14px;
					}
					p{
						margin-bottom: 26px;
						@include maxwidth($smartphone_width){
							// margin: 0 10px 20px;
						}
					}
					img{
						width: 173px;
						@include maxwidth(1200){
							height: 35%;
							width: auto;
						}
						@include maxwidth($tablet_width){
							height: 50%;
							width: auto;
						}
					}
				}
			}
		}
		div.area2{
			background:url(../images/contentfooter-company-02.jpg) center/ cover no-repeat;
			flex: 0 1 100%;
			//width: 479.72px;
			position: relative;
			@include maxwidth($tablet_width){
				//height: 34.2vw;
				height: 42vw;
			}
			@include maxwidth($smartphone_width){
				height: 68.4vw;
				width: 100%;
			}
			&::before{
			background-color: rgba(0,0,0,0.49);
			position: absolute;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
			content: '';
			}
			a{
				display: block;
				div.item{
					@include absolute_centering;
					@include f_all(18,"",27);
					font-weight: bold;
					color: $themetextcolor;	
					@include flex_centering;
					flex-direction: column;
					@include maxwidth(1200){
						font-size: 14px;
					}
					@include maxwidth($tablet_width){
						font-size: 18px;
					}
					@include maxwidth($smartphone_width){
						font-size: 14px;
					}
					img{
						margin-bottom: 23px;
						@include maxwidth(1200){
							width: 180px;
						}
						@include maxwidth($tablet_width){
							width: auto;
						}
					}
				}
			}
		}
		div.area3{
			flex: 0 1 100%;
			//width: 480.02px;
			@include maxwidth($smartphone_width){
				width: 100%;
			}
			a {
				background-color:mix($basetextcolor, $basecolor, .85);
				display:block;
				text-align:center;
				img{
					@include maxwidth($smartphone_width){
						object-fit: cover;
						width: 100%;
						//height: 100%;
					}
				}
			}
		}
	}
}
div#contentFooterRecruit {
	div.container {
		@include container(1440,0);
		background:url(../images/toppage-recruit.jpg) center center/ cover no-repeat;
		// height: 329px;
		display: flex;
		@include maxwidth($tablet_width) { flex-wrap: wrap; }
		position: relative;
		@include maxwidth($smartphone_width){
			//height: 280px;
			height: auto;
		}
		&::before{
			background-color: rgba(0,0,0,0.49);
			position: absolute;
			top: 0;
			right: 0;
			bottom: 0;
			left: 480px;
			content: '';
			@include maxwidth($tablet_width){
				left: 50%;
			}
			@include maxwidth($smartphone_width){
				content: none;
			}

			display: none !important;
		}
		div.btn{
			background-color: rgba(0,0,0,.8);
			// width: 480px;
			// height: 100%;
			flex: 0 1 100%;
			height: 329px;
			padding: 40px 50px 48px;
			box-sizing: border-box;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			@include maxwidth($tablet_width){
				// width: 50%;
				flex-basis: 100%;
			}
			@include maxwidth($smartphone_width){
				// width: 100%;
				height: auto;
				text-align: center;
				padding: 70px 0;
			}
			div.heading {
				// position: absolute;
				// top: 29px;
				// left: 61px;
				// @include maxwidth($tablet_width){
				// 	left: 30.5px;
				// }
				// @include maxwidth($smartphone_width){
				// 	//left: 50%;
				// 	//transform: translate(-50%, 0);
				// 	position:static;
				// 	text-align:center;
				// }
				p.en {
					@include ff_en;
					@include f_all(52,30,"");
					color: $themetextcolor;
				}
				p.ja {
					font-weight: bold;
					@include f_all(16,40,"");
					color: $themetextcolor;
					margin-top: 10px;
				}
			}
			div.body {
				// position: absolute;
				// bottom: 48px;
				// left: 65px;
				// @include maxwidth($tablet_width){
				// 	left: 30.25px;
				// }
				// @include maxwidth($smartphone_width){
				// 	left: 50%;
				// 	left: 0;
				// 	position:static;
				// 	//transform: translate(-50%, 0);
				// 	//-webkit-transform: translate(-50%,0);
				// 	//-ms-transform: translate(-50%, 0);
				// 	bottom: 28px;
				// }
				ul {
					display: flex;
					@include maxwidth($smartphone_width){
						//display: block;
						justify-content: center;
						//text-align: center;
						margin-top: 20px;
					}
					li {
						margin-right: 16px;
						a {
							@include f_all(12,"",48);
							padding: 7px 22px;
							background-color: $basecolor;
							border: 1px solid #707070; 
							border-radius: 25px;
						}
					}
				}
			}

			&.empty {
				@include maxwidth($tablet_width) { display: none !important; }
			}
		}
	}
}

div#contentFooterMap {
	div.container {
		border-bottom: 5px solid $accentcolor;
		overflow: hidden;
		height: 356px;
		position: relative;
		&::after{
			content: "";
			display: block;
			position: absolute;
			top: 0;
			right: 0;
			left: 0;
			bottom: 0;
		}
		iframe {
			width: 100%;
			height: 766px !important;
			top: -160px;
			position: relative;
		}
		a {
			display: block;
			position: absolute;
			background: url( ../images/contentfooter-map-pin.png) left top / cover no-repeat; 
			width: 97px;
			height: 106px;
			top: 0;
			right: 0;
			left: 0;
			bottom:15px;
			margin: auto;
			z-index: 1;
			transition: .15s;
			&:hover{
				opacity: 1;
				transform: scale(1.05);
				transform-origin: center bottom;
			}
			img {
			}
		}
	}
}

// ------------------------------------------------

div#footer {
	background-color: #F4F3EE;
	div.container {
		padding-top: 137px;	
		@include maxwidth(1400){
			padding-top: 60px;	
		}
		@include maxwidth($smartphone_width){
			padding-top: 40px;
		}
		div.footerbody{
			@include container(1228,20);	
			padding-bottom: 143.5px;
			display: flex;
			@include maxwidth($tablet_width){
				display: block;
			}
		}
	}
}
div.addressarea{
	width: 363.54px;
	border-right: 1px solid #B9B9B9;
	@include f_all(12,"",18);
	 @include maxwidth(1200){
	 	@include container(363.54,20);
	 	text-align: center;
		padding-right: 20px;
	 }
	@include maxwidth($tablet_width){
		border-bottom: 1px solid #B9B9B9;
		border-right: none;		
		text-align: center;
		padding-bottom: 30px;
		padding-right: 0;
	}
}
div#footerLogo {
	h2 {
		img {
			width: 268.34px;
			margin-bottom: 30.4px;
		}
	}
}
div#footerAddress {
	p:first-child{
		margin-bottom: 20px;
	}
}
div#footerMenu {
	margin-left: 49px;
	display: flex;
	width: 830px;
	@include maxwidth(1200){
		margin-left: 20px;
	 	display: block;
	 	flex: 0 1 60%;
	}
	@include maxwidth($tablet_width){
		@include container(830,20);
	}
	div.area{
		@include f_all(14,"",21);
			@include maxwidth($tablet_width){
				@include f_all(12,"",21);
			}
			@include maxwidth(1200){
			 	margin-bottom: 30px;
			}
			@include maxwidth($tablet_width){
				padding-top: 20px;
			}
		h3{
			font-weight: bold;
			border-bottom: 1px solid #707070;
			width: 156px;
			padding-bottom: 0.5px;
			margin-bottom: 7.5px;
			@include maxwidth(1200){
				padding-bottom: 5px;
				width: auto;
			}
		}
		ul{
			@include maxwidth(1200){
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
			}
			@include maxwidth(450){
				display: block;
			}
		}
		li{
			@include maxwidth(1200){
				flex: 0 1 49%;
				margin-right: 1%;
				margin-bottom: 7.5px;
				background-color: rgba(#B9B9B9,.2);
				border-radius: 5px;
			}
		}
		a{
			display: block;
			@include maxwidth(1200){
				padding: 0.5em;
			}
		}
	}
	div.area1 {
		margin-right: 76px;
		@include maxwidth(1200){
			margin-right: 0;
			margin-left: 0;
		}
		@include maxwidth($tablet_width){
			padding-top: 40px;
		}
		ul {
			@include maxwidth($tablet_width){
				justify-content: center;
				text-align: center;
			}
			li {
				width: 75px;
				@include maxwidth(1200){
					flex: 0 1 49%;
					width: 100%;
				}
				a {
					img{
						padding-right: 12.7px;
						vertical-align:bottom;
						top: -3px;
						position:relative;
					}
				}
			}
		}
	}
	div.area2 {
		margin-right: 42px;
		@include maxwidth(1200){
			margin-right: 0;
			margin-left: 0;
		}
	}
	div.area3 {
		margin-right:  45px;
		@include maxwidth(1200){
			margin-right: 0;
			margin-left: 0;
		}
		& > ul:nth-child(2){
			margin-bottom: 20px;
		}
	}
	div.area4 {
		& > ul:nth-child(2){
			margin-bottom: 20px;
		}
	}
}
div#footerCopy {
	background-color: $accentcolor;
	color: $themetextcolor;
	@include f_all(10,"",15);
	font-weight: bold;
	text-align: center;
	padding: 13px 0 12px;
}

/*============================
#subpageContent
============================*/
div#subpageContent {
	padding-bottom: 150px;
	@include maxwidth($smartphone_width){
		padding-bottom: 150px;
	}
	& > div.container {
		@include container(1151,20);
	}
	body.page-business & {
		div.default {
			h1 {
			}
			table {
				@include container(1158,20);
				tbody {
					tr {
						th {
							width: 403px;
							@include maxwidth(1100){
								width: 320px;
							}
							p {
							@include maxwidth(768){
								text-align: center;
							}
								img {
								}
							}
						}
						td {
							p {
								width: 755px;
								@include f_all(18,"",28);
								@include maxwidth(1200){
									width: auto;
								}
								@include maxwidth($smartphone_width){
									font-size: 12px;
								}
							}
						}
					}
				}
			}
			h2 {
			}
		}
	}
}

// ------------------------------------------------

div#totop {
	div.container {
		@include container(1440, 0);
		a {
			display: inline-block;
			position: absolute;
			bottom: 39px;
			right: 0;
			img {
				width: 64px;
			}
		}
	}
}

// ------------------------------------------------
// ------------------------------------------------

//通常のスタイリングを使いたい時にdiv.defaultで囲む
div.default {

	@include contentdefault;

	table {
		table-layout: fixed;
		&.column_content_style {
			width:100%;
			tbody {
				tr {
					th {
						white-space: normal;
					}
					th, td {
						padding: 76px 62px 76px 0;
						border: none;
						&:first-child {
							padding-left: 88px;
							border: none;
						}
					}
				}
			}
			@include maxwidth(800){
				&, tbody, tr, th, td {
					display:block;
				}
				th, td {
					padding: 0!important;
					width: 100%!important;
					margin-bottom: 30px;
				}
			}

		}
	}
}

div#gnavToggle {
	position:fixed;
	top:0;
	@include fixed_top_adminbar_exists(0);
	width:100%;
	z-index: 100;
	div.container {
		width: 1072px;
		max-width: 100%;
		margin:auto;
		position:relative;
		box-sizing:border-box;
		z-index: $zindex_gnavtoggle;
		a {
			display:block;

			width: 35.2px;
			height:34.6px;

			//box-shadow: 0 0 0 3px #fff inset;
			border: 3px solid $themetextcolor;
			box-sizing:border-box;
			border-radius: 5px;


			position:absolute;
			right:10px;
			top: 12px;
			-webkit-tap-highlight-color: rgba(0,0,0,0);
			&:hover {opacity: 1;}
			span.b {
				content:'';
				display:block;
				width:23px;
				height: 3px;
				border-radius: 10px;
				background-color:$themetextcolor;
				position:absolute;
				top:0;right:0;bottom:0;left:0;
				margin:auto;
				transition: .25s;
				&.b1 {transform: translateY(-8px);}
				&.b2 {}
				&.b3 {transform: translateY(8px);}
			}
			body.menu_open & {
				background-color:#d00;
				box-shadow: 0 0 0 3px #d00 inset;
				span {
					background-color:#fff;
					&.b1 {transform: rotateZ(3*135deg);}
					&.b2 {opacity: 0;}
					&.b3 {transform: rotateZ(3*45deg);}
				}
			}
		}
	}
}

div.pager {
	text-align: center;
	font-size: .875em;
	margin-top: 40px;
	@media screen and (max-width: 540px) {
		font-size: .6875em;
	}
	a, span {
		display: inline-block;
		margin: 0 0.25em 0.75em;
		min-width: 3em;
		padding: 1em 1em;
		box-sizing: border-box;
		background-color: #ddd;
		&.current {
			background-color: $themecolor;
			color: $themetextcolor;
		}
	}
}


.informationHeadline {
	ul {
		li {
			@include f_all(14, "", 24);
			border-bottom: 1px solid #ccc;
			a {
				display:flex;
				@include maxwidth(420){
					display:block;
				}
				padding: 1.2em 0;
				span {
					@include maxwidth(420){
						display:block;
					}
					&.date {
						flex: 0 1 120px;
						@include fw_b;
						color:$themecolor;
					}
					&.title {
						flex: 1 1 auto;
					}
				}
			}
		}
	}
}

