﻿
@import url("default.css");
@import url("font2.css");
:root{
	--fontsizeTab:calc((1rem + ((1vw - 7.51px) * 1.33155792276964)) * 0.69537037037037);
	--fontsizePhone:calc((1rem + ((1vw - 3.2px) * 3.125)) * 0.426666666666667);
	--textcolor:#262323;
	--maincolor:#94c5e1;
}
:focus {
    outline: none;
}
html{
	font-size:0.628em;
}
body{
	color:#262323;
}
a{
	color:#262323;
	transition:color 0.3s,background-color 0.3s,opacity 0.3s,border-color 0.3s;
}
a img{
	transition:opacity 0.3s;
}
.btn a i{
	transition:color 0.3s,background-color 0.3s,opacity 0.3s;
}
.btn a{
	display:block;
}
header{
	position: relative;
}
#global_navi,#footer_navi{
	font-weight: 300;
}
#global_navi a{
	display:block;
}
#global_navi .main li{
	position:relative;
}
header .jp a{
	text-align:center;
	background:#000000;
	color:#94c5e1;
	font-weight:500;
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	right:0;
	bottom:0;
	left:0;
}
#global_navi .jp a span{
	position:absolute;
	width:100%;
	height:1em;
	top:0;
	right:0;
	bottom:0;
	left:0;
	margin:auto;
}

main{
	display:block;
}
.tleStyle1{
	text-align:center;
	font-weight:300;
}
footer{
	background:#e8e8e8;
}
footer .brands{
	background:#ffffff;
	border-top:1px solid #dddddd;
	border-bottom:1px solid #dddddd;
}
footer .brands ul{
	display:table;
	table-layout:fixed;
	margin-right:auto;
	margin-left:auto;
	line-height:0;
	width:100%;
}
footer .brands li{
	display:table-cell;
	text-align:center;
}

#footer_navi{
	display:flex;
}
#footer_navi a{
	transition:color 0.3s;
}
footer .copyright{
	color:#989898;
}
/*Main
---------------------------------------*/
#bleadList{
	background:#dddddd;
}
#bleadList ul{
	display:flex;
	font-size:0.824em;
	max-width:1600px;
	width:90%;
	box-sizing: border-box;
	margin-right:auto;
	margin-left:auto;
}
#bleadList i{
	font-size:0.6em;
	vertical-align: middle;
	margin:0 5px;
}
#topvisual{
	position:relative;
	width:100%;
	overflow:hidden;
}
#topvisual:after{
	content:"";
	display:block;
	width:100%;
	box-sizing:border-box;
	background-repeat:no-repeat;
	background-position:center top;
	background-size:100% auto;
	transform:translateX(-50%);
	position:relative;
	left:50%;
	z-index:10;
}
#topvisual >.toptle{
	width:100%;
	height:1em;
	text-align:center;
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	margin:auto;
	z-index:50;
	letter-spacing: 0.08em;
}

.btnStyle{
	margin-right:auto;
	margin-left:auto;
}
.btnStyle a{
	text-align:center;
	border-radius:100px;
	border-width:1px;
	border-style:solid;
	font-weight:500;
	position:relative;
}
.btnStyle i{
	position:absolute;
	width:1em;
	height:1em;
	top:0;
	bottom:0;
	left:1em;
	margin:auto;
}
.btnStyle i.enic-pdf{
	font-size:1.176em;
}
.btnStyle i.enic-right{
	font-size:0.8em
}
.tleStyle2{
	text-align:center;
	font-weight:300;
}
.tleStyle2{
	text-align:center;
	font-weight:300;
}
#itemlist .btnStyle a{
	border-color:#262323;
	font-size:0.853em;
}
#itemlist .btnStyle i{
	color:#94c5e1;
}
#send li{
	border:1px solid #dddddd;
	text-align:center;
	box-sizing: border-box;
}
#send li i,#allbtn i{
	color:#94c5e1;
}
#send dt{
	font-weight:300;
}
#send dt i{
	font-size:1.176em;
	vertical-align: middle;
	margin-right:7px;
}
#send dd{
	font-weight:400;
}
#send .btn{
	font-size:0.912em;
}
#pagetop{
	width:3em;
	height:3em;
	border-radius:50%;
	background:rgba(148,197,225,0.8);
	position:fixed;
	right:2%;
	bottom:2%;
	transition:bottom 0.2s,background-color 0.3s;
/*	z-index: 900;*/
}
#pagetop a{
	display:block;
	width:100%;
	height:100%;
}
#pagetop a,#pagetop a i{
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	margin:auto;
	color:#ffffff;
}
#pagetop a i{
	width:1em;
	height:1em;
	position:absolute;
}
.external,.external2{ position: relative; }
.external::after,.external2::after{ position: absolute; content: "";width: 18px; height: 18px;  background-size: 50%;
	 right: -30px; top: 0;
	 background-position: 0 0; background-repeat: no-repeat;}
.external::after{ background-image: url(../image/externalIcon1.png) ;}
.news .external::after{ right: -22px; }
.external2::after{ background-image: url(../image/externalIcon2.png) ;}




#allbtn{
	border-top: solid 1px #d3d3d3;
	margin-top: 50px;
	padding-top: 50px;
}
#allbtn > div{
	width: 290px;
	margin: 0 auto;
	font-size: 110%;
}
#allbtn > div.btnStyle a{
	background-color: #fdfbe3;
}
#allbtn > div.btnStyle i.linkout{
	background-image: url("../image/link_out_off.png");
	background-size: 100% auto;
	width: 12px;
	height: 12px;
}
#allbtn > div.btnStyle a:hover{
	background-color: #94c5e1;
}
#allbtn > div.btnStyle a:hover i.linkout{
	background-image: url("../image/link_out_on.png");
}

/*PC
----------------------------------------------------*/
@media screen and (min-width:1081px),print{
	body{
		font-size:1.7rem;
	}
	header{
		display:flex;
		justify-content: space-between;
		padding-left:50px;
		max-width:1600px;
		padding-top:25px;
		padding-bottom:25px;
		margin-right:auto;
		margin-left:auto;
	}
	#global_navi,#global_navi >ul{
		display:flex;
	}
	#global_navi .main{
		margin-right:110px;
	}
	#global_navi .main li{
		padding-bottom:20px;
		margin-right:20px;
		margin-left:20px;
		font-size:0.971em/*16.5px*/;
	}
	#global_navi .main li.active:after,#global_navi .main li:hover:after{
		width:100%;
		height:1px;
	}
	#global_navi .main li:after{
		content:"";
		display:block;
		width:1px;
		height:0;
		background:#262323;
		position: absolute;
		right:0;
		left:0;
		bottom:0;
		margin:auto;
		transition:width 0.3s;
	}
	#global_navi .main .about{
		margin-right:0;
	}
	#global_navi i,#global_navi .sub,.gnavi_btn{
		display:none;
	}
	#global_navi .jp{
		width:80px;
		height:80px;
		position:absolute;
		top:0;
		right:0;
		font-size:0.882em;
	}
	#global_navi .jp:hover a{
		color:#000000;
		background:#94c5e1;
	}
	.tleStyle1{
		font-size:1.882em;
	}
	#logo{
		width:230px;
	}
	footer{
		display:flex;
		flex-wrap:wrap;
		justify-content: space-between;
		align-items:center;
		margin-top:100px;
	}
	footer .brands{
		width:100%;
	}
	footer .brands ul{
		width:610px;
		margin-right:auto;
		margin-left:auto;
		padding-top:45px;
		padding-bottom:45px;
	}
	footer .brands li{
		padding:0 30px;
	}
	#footer_navi{
		margin-top:50px;
		margin-bottom:50px;
		margin-left:50px;
	}
	#footer_navi ul{
		font-size:0.853em;
		display:flex;
	}
	#footer_navi li:not(:last-of-type){
		margin-right:30px;
	}
	footer .copyright{
		font-size:0.735em;
		margin-right:50px;
	}
	/*Main
	---------------------------------------*/
	#bleadList ul{
		padding:7px 10px;
	}
	#topvisual:after{
		width:100%;
		min-width:1600px;
		min-height:290px;
		padding-top:18.125%;
	}
	.btnStyle a{
		padding-top:0.9em;
		padding-bottom:0.9em;
	}
	#itemlist{
		display:flex;
		justify-content: space-between;
	}
	#itemlist li{
		width:320px;
	}
	#itemlist .btn{
		width:220px;
	}
	#itemlist .image{
		margin-bottom:20px;
	}
	#itemlist p{
		margin-top:30px;
		margin-bottom:30px;
	}
	.tleStyle2{
		font-size:1.353em;
	}
	#send{
		display:flex;
		justify-content: space-between;
	}
	#send li{
		padding:50px;
		width:500px;
	}
	#send dt{
		margin-bottom:20px;
		font-size:1.412em;
	}
	#send .btn{
		width:280px;
	}
	#send .telnum{
		font-size:1.882em;
	}
	#pagetop{
		width:4em;
		height:4em;
		bottom:5%;
	}
	#pagetop i{
		font-size:1.5em;
	}


}
/*PC and Tablet
----------------------------------------------------*/
@media screen and (min-width:751px),print{
	a img:hover{
		opacity:0.5;
	}
	.telnum a{
		pointer-events:none;
	}
	.btnStyle1 a:hover {
		color: #fff;
		background-color:#94c5e1;
		border-color:#94c5e1!important;
	}
	.btnStyle1 a:hover i{
		color:#fff!important;
	}
	#send{
		justify-content: space-between;
	}
	#topvisual:after{
		min-width:800px;
		min-height:145px;
		padding-top:18.125%;
		background-image:url(../image/tv_pc.jpg);
	}
	#topvisual >.toptle{
		font-size:2.353em;
	}
	#footer_navi a:hover{
		color:#94c5e1;
	}
	#pagetop:hover{
		background:rgba(148,197,225,1);
	}
	

}
/*Tablet
----------------------------------------------------*/
@media screen and (min-width:751px) and (max-width:1080px){
	#logo{
		width:300px;
	}
	header{
		font-size:calc((1rem + ((1vw - 7.51px) * 1.33155792276964)) * 0.69537037037037);
	}
	footer .brands{
		padding-top:5%;
		padding-bottom:5%;
	}
	footer .brands ul{
		width:70%;
	}
	#footer_navi ul{
		justify-content: center;
	}
	#footer_navi li:not(:last-of-type){
		margin-right:3%;
	}
	/*Main
	---------------------------------------*/
	#itemlist{
		display:flex;
		flex-wrap:wrap;
	}
	#itemlist li{
		width:31.3%;
		margin-right:3%;
	}
	#itemlist li:nth-child(3){
		margin-right:0;
	}
	#send{
		display:flex;
		justify-content: space-between;
		font-size:calc((1rem + ((1vw - 7.51px) * 1.33155792276964)) * 0.69537037037037);
	}
	#send >li{
		width:48%;
		box-sizing:border-box;
	}
	#send dt{
		font-size:2.4em;
	}
	#send .telnum{
		font-size:3.2em;
	}
	#send .btn{
		font-size:1.5em;
	}

	/*#allbtn{ width: 460px; }*/
}
/*Tablet und Phone
----------------------------------------------------*/
@media screen and (max-width:1080px){
	body{
		font-size:1.7rem;
	}
	header{
		width:100%;
		background:#ffffff;
		padding-top:2%;
		padding-bottom:2%;
		position: fixed;
		top:0;
		right:0;
		left:0;
		z-index:150;
	}
	#logo{
		text-align:center;
		margin-right:auto;
		margin-left:auto;
	}

	header .gnavi_btn{
		width:11em;
		position:absolute;
		overflow:hidden;
		top:0;
		left:0;
		margin:auto;
	}
	header .gnavi_open{
		border-right:1px solid #dbdbdb;
		height:100%;
		bottom:0;
	}
	header .gnavi_close{
		height:11em;
		z-index:999;
	}
	header .gnavi_btn >.wrap{
		width:5em;
		height:3.4em;
		position:absolute;
		top:0;
		right:0;
		bottom:0;
		left:0;
		margin:auto;
	}
	header .gnavi_btn span{
		display:block;
		width:100%;
		height:1px;
		position:absolute;
		right:0;
		left:0;
		margin:auto;
	}
	header .gnavi_open span{
		background:#b2c2d9;
	}
	header .gnavi_close span{
		background:#ffffff;
	}
	.gnavi_open span:first-child{
		top:0;
	}
	.gnavi_btn span:nth-child(2),header .gnavi_close span{
		top:0;
		bottom:0;
	}
	.gnavi_open span:last-child{
		bottom:0;
	}
	header .gnavi_close span:first-child{
		transform:rotate(45deg);
	}
	header .gnavi_close span:last-child{
		transform:rotate(-45deg);
	}
	header >nav{
		width:100%;
		height:0;
		position:fixed;
		box-sizing:border-box;
		background: rgb(148,197,225);
		background: linear-gradient(0deg, rgba(148,197,225,0.7) 0%, rgba(148,197,225,1) 100%);
		top:0;
		right:0;
		bottom:0;
		left:0;
		overflow-y: auto;
		z-index:998;
		transition:height 0.2s,padding-top 0.1s;
	}
	header >nav.active{
/*		width:100%;
		height:100vh;*/
		padding-top:11em;
		display:block;
	}
	#global_navi{
		padding:0 5% 5%;
	}
	#global_navi li >a{
		color:#ffffff;
		text-align:center;
	}
	#global_navi .jp{
		position:absolute;
		top:0;
		right:0;
		width:11em;
		height:11em;
	}
	#global_navi a i{
		display:inline-block;
		width:1em;
		height:1em;
		border-radius:50%;
		background:#ffffff;
		color:#94c5e1;
		position:relative;
		top:0.2em;
		margin-left:5px;
	}
	#global_navi a i:before{
		font-size:0.5em;
		width:1em;
		height:1em;
		position:absolute;
		top:0.2em;
		right:0;
		bottom:0;
		left:0;
		margin: auto;
		vertical-align: middle;
	}
	#global_navi .main{
		font-size:3em;
	}
	#global_navi .main >li{
		padding-bottom:3%;
	}
	#global_navi .main >li:not(:last-of-type),#global_navi .sub li:not(:last-of-type){
		margin-bottom:3%;
	}
	#global_navi .sub{
		background:rgba(255,255,255,0.85);
		margin-top:2%;
		padding:3%;
		display:none;
	}
	#global_navi .sub a{
		color:#94c5e1;
	}
	#global_navi .jp span{
		font-size:2.4em;
	}
	footer .brands li{
		padding:0 2%;
	}
	#footer_navi{
		padding:3% 5% 0;
		margin:0 5% 2%;
	}
	#footer_navi ul{
		display:flex;
		flex-wrap:wrap;
		width:100%;
	}
	footer .copyright{
		text-align:center;
		padding:0 5% 3%;
	}
	/*Main
	---------------------------------------*/
	#bleadList{
		padding-top:2%;
		padding-bottom:2%;
	}
	.tleStyle1{
		font-size:1.882em;
	}
	.tleStyle2{
		font-size:1.353em;
		margin-top:3%;
		margin-bottom:3%;
	}
	.btnStyle a{
		padding-top:1em;
		padding-bottom:1em;
	}
	main .section:not(:last-of-type){
		margin-bottom:7%;
	}
	#itemlist >li{
		display:flex;
		flex-wrap:wrap;
	}
	#itemlist >figure,#itemlist .tleStyle2,#itemlist p{
		width:100%;
	}
	#itemlist .btn{
		margin-top:5%;
		width:90%;
		align-self: flex-end;
	}
	#itemlist .btn a,#allbtn a{
		padding:5% 2%;
	}
	#send >li{
		padding:3%;
	}
	#send >li,#send dl{
		display:flex;
		flex-wrap:wrap;
	}
	#send dt{
		margin-bottom:3%;
		width:100%;
	}
	#send dd{
		width:100%;
		align-self: center;
	}
	#send .btn{
		width:90%;
	}
	#send .btn a{
		padding-top:1.5em;
		padding-bottom:1.5em;
	}
	footer{
		margin-top:10%;
	}

	#allbtn{ margin-top: 30px; }
}
/*Phone
----------------------------------------------------*/
@media screen and (max-width:750px){
	#logo{
		width:60%;
	}
	header{
		font-size:calc((1rem + ((1vw - 3.2px) * 3.125)) * 0.426666666666667);
	}
	footer{
		margin-top:10%;
		font-size:calc((1rem + ((1vw - 3.2px) * 3.125)) * 0.426666666666667);
	}
	footer .brands{
		padding-top:5%;
		padding-bottom:5%;
	}
	footer .brands ul{
		width:90%;
	}
	#footer_navi{
		margin-bottom:5%;
	}
	#footer_navi ul{
		font-size:2.6em;
	}
	#footer_navi li{
		width:50%;
		padding-top:2%;
		box-sizing:border-box;
	}
	#footer_navi li:first-child,#footer_navi li:nth-child(2){
		padding-top:0;
	}
	#footer_navi li:nth-child(2n){
		border-left:1px solid #ffffff;
		padding-left:7%;
	}
	footer .copyright{
		font-size:2em;
	}
	/*Main
	---------------------------------------*/
	#bleadList{
		font-size:calc((1rem + ((1vw - 3.2px) * 3.125)) * 0.426666666666667);
	}
	#bleadList li{
		font-size:2.4em;
	}
	#topvisual{
		font-size:calc((1rem + ((1vw - 3.2px) * 3.125)) * 0.426666666666667);
	}
	#topvisual:after{
		padding-top:37.3333%;
		background-image:url(../image/tv_phone.jpg);
	}
	#topvisual >.toptle{
		font-size:6em;
	}
	#itemlist figure{
		margin-right:auto;
		margin-left:auto;
		width: 100%;
    text-align: center;
	}
	#itemlist li:not(:last-of-type){
		margin-bottom:5%;
	}
	#itemlist.top li:not(:last-of-type){
		margin-bottom:12%;
	}
	#send{
		font-size:calc((1rem + ((1vw - 3.2px) * 3.125)) * 0.426666666666667);
	}
	#send dl{
		margin-right:auto;
		margin-left:auto;
		width:100%;
	}
	#send >li{
		padding:7% 5%;
	}
	#send >li:not(:last-of-type){
		margin-bottom:5%;
	}
	#send dt{
		font-size:2.88em;
	}
	#send .telnum{
		font-size:3.84em;
	}
	#send .btn{
		font-size:2.6em;
	}
	#pagetop{
		bottom:2%;
	}
	/*#allbtn{ width: 90%; }*/
	#allbtn{
		border-top: solid 1px #d3d3d3;
		padding-top: 25px;
		margin-bottom: 60px;
	}
	#allbtn > div{
		width: 100%;
	}
}