@charset "UTF-8";
/* CSS Document */

/* ========== Clearfix ========== */
/* For modern browsers */


.pc_tb_none{
	display:none;
}


.clearfix:before,
.clearfix:after {
	content:"";
	display:table;
}

.clearfix:after {
	clear:both;
}

/* For IE 6/7 (trigger hasLayout) */
.clearfix {
	zoom:1;
}

.clear {
	clear: both;
}


body {
	font: 12px/2.2;
	font-family:"Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	margin: 0px;
	color:#000;
}


.wf-hannari { font-family: "Hannari"; }



/* 隠れコンテンツ アップボタン*/

#page-up {
	font-family: 'Merriweather', serif;
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 60%;
    z-index:5;
}
#page-up a {
    background: #000;
    text-decoration: none;
    color: #fff;
    width: 50px;
    padding: 20px 5px;
    text-align: center;
    display: block;
    border-radius: 3px;
    background-blend-mode: overlay;
}
#page-up a:hover {
    text-decoration: none;
    background: #ccc;
}

/* 隠れコンテンツ アップボタン*/



/* ふわっとアニメーション */

.fuwatAnime {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1.0s;
 -ms-animation-duration:1.0s;
 animation-duration:1.0s;
 -webkit-animation-name: fuwatAnime;
 -ms-animation-name: fuwatAnime;
 animation-name: fuwatAnime;
 visibility: visible !important;
}
@-webkit-keyframes fuwatAnime {
 0% { opacity: 0; -webkit-transform: translateY(10px); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fuwatAnime {
 0% { opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}

.top{
	position:relative;
}

.top .logo{
	position:absolute;
	padding:20px 0 0 20px;
	width:40%;
	max-width:300px;
	height:100%;
	box-sizing:border-box;
}

.top .logo img{
	box-sizing:border-box;
}


.top .main_video{
	width:100%;
	height:100vh;
	overflow:hidden;
}

.top .main_video video {
	height:100%;
	min-width:100%;
	margin-left:-100vw;	
}



.consept_b{
	width:100%;
	background:#fff;
}


.consept_b ul{
	margin:0;
	padding:0;
	clear:both;
}

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

.consept_b ul li:nth-child(1){
	width:100%;
	box-sizing:border-box;
	padding:70px 0 0 0;
}

.consept_b ul li:nth-child(1) dl{
	font-size:16px;
	margin:0 auto;
	text-align:center;
}

.consept_b ul li:nth-child(1) strong{
	padding:5px 10px;
	text-align:inherit;
}


.consept_b ul li:nth-child(1) h2{
	font-size:20px;
	letter-spacing:0.2em;
	font-weight:bold;
	margin:0;
	padding:0;
}


.consept_b ul li:nth-child(1) h2 span{
	margin:0;
	padding:0;
}

.consept_b ul li:nth-child(1) h2 span::before{
	content: "\A" ;
	white-space: pre ;
}


.consept_b ul li:nth-child(2){
	width:100%;
	padding:40px 3% 50px 3%;
	color:#000;
	box-sizing:border-box;
}

.consept_b ul li:nth-child(2) dl{
	font-size:14px;
	letter-spacing: .18em;
	line-height: 2.5em;
}

.consept_b ul li:nth-child(2) dl dt{
	font-size:20px;
	font-weight:bold;
	border-bottom:1px solid #000;
}



.consept_c{
	width: 100%;
    height: 70vh;
	clear:both;
	position:relative;
  }

.consept_c::before{
 background: url(../img/ac_img_a.jpg) center/cover no-repeat;
 background-position: center center;
 background-repeat: no-repeat;
 background-size: cover;
 -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 /*background-attachment: fixed;*/
 position: fixed;
 top: 0;
 left: 0;
 padding: 10% 0;
 width: 100%;
 height: 100%;
 content: "";
 z-index: -1;
}  

.consept_c dl{
	width:90vw;
	height:15vh;
	top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    position: absolute;
    margin: auto;
}


.consept_c dl dd{
	font-size:110%;
	margin:0 0 10px 0;
	font-weight:700;
}

.consept_c dl dd span{
	color:#000;
	letter-spacing:0.1em;
}

.consept_c dl dt{
	font-weight:700;
	color:#000;
	padding:10px 0 0 5%;
	font-size:120%;
	margin-top:50px 0 0 0;
	letter-spacing:0.1em;
	align-items: center;
}


.consept_c dl dt span::before {
	content: "\A" ;
	white-space: pre ;
}

.consept_d{
	width:100%;
	font-size:16px;
	letter-spacing: .18em;
	line-height: 2.5em;
	padding:70px 3% 50px 3%;
	background-color: #f5f5f5;
	box-sizing:border-box;
}


.consept_d h2{
	font-size:20px;
	text-align:center;
	margin:0 0 50px 0;
}


.consept_d h2 span::before{
	content: "\A" ;
	white-space: pre ;
}


.consept_d dl{
	font-size:14px;
	width:100%;
	margin:0 auto;
}


.consept_e{
	width:100%;
	box-sizing:border-box;
	background:#fff;
}

.consept_e ul{
	padding:0;
	margin:0;
}

.consept_e ul li{
	width:100%;
	list-style:none;
	box-sizing:border-box;
}

.consept_e .col500 {
	box-sizing:border-box;
	}

.consept_e .col750 {
	box-sizing:border-box;
	}

.consept_e .col500 img,
.consept_e .col750 img{
	width:100%;
	}

.consept_f{
	width:100%;
	padding:50px 0;
	box-sizing:border-box;
	background:#fff;
}

.consept_f .logo{
	width:100%;
	text-align:center;
	padding-bottom:50px;
}

.consept_f .logo img{
	width:60%;
}

.consept_f dl{
	width:90%;
	margin:0 auto;
	padding:0px 20px 20px 20px;
	border:7px solid #333;
	box-sizing:border-box;
}

.consept_f dl dt{
	font-size:15px;
	text-align:center;
	font-weight:bold;
	border-bottom:1px solid #000;
	padding:0 0 20px 0;
}

.consept_f dl dt span{
	font-family:Arial, Helvetica, sans-serif;
	font-size:40px;
}


.consept_f dl dt span::before{
	content: "\A" ;
	white-space: pre ;
}

.consept_f dl dd{
	font-size:12px;
	margin:20px 0 0 0;
}


.consept_g{
	padding:50px 0;
	background:#000;
	overflow:auto;
}

.consept_g h2{
	color:#fff;
	font-family: "Times New Roman", Times, serif;
	font-size:20px;
	font-weight:normal;
	text-align:center;
	margin-bottom:50px;
}

.consept_g ul{
	padding:0;
	margin:0 auto;
}

.consept_g ul li{
	color:#fff;
	list-style:none;
	width:80%;;
	margin:0 auto 50px auto;
}

.consept_g ul li img{
	width:100%;
}

.consept_g ul li dl dt{
	text-align:center;
	font-size:20px;
	font-weight:bold;
}


.consept_g ul li dl dd{
	margin:0;
	text-align:center;
	font-size:12px;
}

.consept_g ul li dl dd span{
	text-align:center;
	font-size:7px;
	background:#fff;
	padding:3px 7px;
	margin-left:10px;
	font-weight:bold;
	border-radius:7px;		/* CSS3草案 */
	-webkit-border-radius:7px;	/* Safari,Google Chrome用 */
	-moz-border-radius:7px;	/* Firefox用 */
}

.consept_g ul li dl dd span a{
	color:#000;
	text-decoration:none;
}



.consept_g ul li dl .btn{
	width:100%;
	text-align:center;
	margin-top:15px;
}

.consept_g ul li dl .btn span{
	font-size:12px;
}


.consept_g ul li dl .btn a{
	color:#fff;
	text-decoration:none;
	padding:3px 20px;
	border:1px solid #fff;
}


.consept_g ul li dl .btn a:hover{
	color:#000;
	text-decoration:none;
	background-color: #fff;
}


.consept_g ul li dl .btn a,
.consept_g ul li dl .btn a::before,
.consept_g ul li dl .btn a::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.consept_h{
	padding:50px 0;
	overflow:auto;
	background:#fff;
}


.consept_h h2{
	font-family: "Times New Roman", Times, serif;
	font-size:20px;
	font-weight:normal;
	text-align:center;
	margin-bottom:50px;
}


.consept_h ul{
	padding:0;
	margin:0 auto;
}

.consept_h ul li{
	font-size:20px;
	text-align:center;
	list-style:none;
	box-sizing:border-box;
}

.consept_h ul li:nth-child(1){
}

.consept_h ul li:nth-child(1) dl dt{
	font-size:15px;
	font-weight:bold;
}

.consept_h ul li:nth-child(1) dl dt span::after{
	content: "\A" ;
	white-space: pre ;
}

.consept_h ul li:nth-child(1) dl dd{
	font-family:Arial, Helvetica, sans-serif;
	font-size:40px;
	font-weight:bold;
	margin:10px 0;
}


.consept_h ul li:nth-child(1) dl dd a{
	text-decoration:none;
	color:#000;
}



.consept_h ul li:nth-child(1) dl dd span img{
		height:35px;
		margin-right:10px;
		vertical-align: -5px;
}


.consept_h ul li:nth-child(2){
}

.consept_h ul li:nth-child(2) dl{
	margin:20px auto 0 auto;
	padding:20px 0;
}

.consept_h ul li:nth-child(2) dl dd{
	font-size:20px;
	font-weight:bold;
	margin:0;
}

.consept_h ul li:nth-child(2) dl dd a{
	color:#000;
	padding:15px 20px;
	border:4px solid #000;
	text-decoration:none;
}

.consept_h ul li:nth-child(2) dl dd span em img{
		height:30px;
		vertical-align:-7px;
		margin-right:10px;
}


.consept_h ul li:nth-child(2) dl dd a:hover{
	border:4px solid #a00;
}


.consept_h ul li:nth-child(2) dl dd a {
  display: inline-block;
  text-align: center;
  text-decoration: none;
  line-height: 54px;
  outline: none;
}
.consept_h ul li:nth-child(2) dl dd a::before,
.consept_h ul li:nth-child(2) dl dd a::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.consept_h ul li:nth-child(2) dl dd a,
.consept_h ul li:nth-child(2) dl dd a::before,
.consept_h ul li:nth-child(2) dl dd a::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}



.consept_mat{
	width:100%;
	padding:70px 0;
	overflow:auto;
	background:#fff;
}

	
.consept_mat dt{
	width:100%;
	text-align:center;
}

.consept_mat dt img{
	width:98%;
}

.consept_mat dl{
	width:94%;
	font-size:14px;;
	letter-spacing: .18em;
	line-height: 2.5em;
	margin:20px auto;
	box-sizing:border-box;
}

.consept_mat dl h3{
	font-size:20px;
	margin-bottom:20px;
	text-align:center;
}


.consept_mat dl h3 span::before{
	content: "\A" ;
	white-space: pre ;
}



.consept_comp{
	width:100%;
	margin:0 auto;
	padding:70px 0;
	overflow:auto;
	background:#f5f5f5;
	box-sizing:border-box;
}

	
.consept_comp dt{
	width:95%;
	margin:0 auto;
}


.consept_comp dt table{
	width:100%;
	font-size:90%;
}


.consept_comp dt table tr{
	width:100%;
}

.consept_comp dt table tr .sab{
	width:18%;
}

.consept_comp dt table tr .main{
	width:26%;
	background:#a00 !important;
}

.consept_comp dt table tr td{
	background:#fff;
	padding:10px 0;
	text-align:center;
}

.consept_comp dt table tr .none{
	background:none;
}

.consept_comp dt table tr .comp_name{
	font-size:90%;
	background:#000;
	color:#fff;
}


.consept_comp dt table tr .detail_name{
	font-size:90%;
	background:#4f677d;
	color:#fff;
	text-align:initial;
	padding-left:2%;
	width:20%;
	box-sizing:border-box;
}

.consept_comp dl{
	width:94%;
	font-size:14px;
	letter-spacing: .18em;
	line-height: 2.5em;
	margin:0 auto;
	box-sizing:border-box;
}

.consept_comp dl h3{
	font-size:20px;
	margin:0px;
	text-align:center;
}


.consept_comp dl h3 span::before{
	content: "\A" ;
	white-space: pre ;
}




.consept_choose{
	width:100%;
	font-size:14px;
	letter-spacing: .18em;
	line-height: 2.5em;
	padding:70px 0 0 0;
	box-sizing:border-box;
	background:#fff;
}



.consept_choose h2{
	font-size:20px;
	text-align:center;
	margin:0 0 30px 0;
}

.consept_choose h2 span::before{
	content: "\A" ;
	white-space: pre ;
}

.consept_choose dl{
	width:94%;
	margin:0 auto;
}


.consept_choose ul{
	width:100%;
	padding:0;
	margin-top:50px;
	overflow:auto;
}

.consept_choose ul li{
	list-style:none;
	float:left;
}

.consept_choose ul li img{
	width:100%;
}


.consept_choose ul li:nth-child(1){
	width:45%;
	padding-top:32%;
	background:url(../img/ac_img_cho_1.webp) no-repeat 0 0;
	background-size:100%;
}

.consept_choose ul li:nth-child(2){
	width:55%;
	padding-top:32%;
	background:url(../img/ac_img_cho_2.jpg) no-repeat 0 0;
	background-size:100%;
}

.consept_choose ul li:nth-child(3){
	width:45%;
	padding-top:32%;
	background:url(../img/ac_img_cho_3.webp) no-repeat 0 0;
	background-size:100%;
}

.consept_choose ul li:nth-child(4){
	width:55%;
	padding-top:32%;
	background:url(../img/ac_img_cho_4.jpg) no-repeat 0 0;
	background-size:100%;
}

.consept_choose ul li:nth-child(5){
	width:55%;
	padding-top:32%;
	background:url(../img/ac_img_cho_5.jpg) no-repeat 0 0;
	background-size:100%;
}

.consept_choose ul li:nth-child(6){
	width:45%;
	padding-top:32%;
	background:url(../img/ac_img_cho_6.jpg) no-repeat 0 0;
	background-size:100%;
}

.consept_choose ul li:nth-child(7){
	width:55%;
	padding-top:32%;
	background:url(../img/ac_img_cho_7.jpg) no-repeat 0 0;
	background-size:100%;
}

.consept_choose ul li:nth-child(8){
	width:45%;
	padding-top:32%;
	background:url(../img/ac_img_cho_8.jpg) no-repeat 0 0;
	background-size:100%;
}





.footer_menu{
	width:100%;
	background:#000;
	overflow:auto;
	padding:0;
}

.footer_menu ul{
	padding:20px 0 30px 0;
	margin:0 auto;
}
	
.footer_menu ul li{
	width:100%;
	font-size:13px;
	list-style:none;
	text-align:center;
	margin:0 0 15px 0;
}


.footer_menu ul li a{
	color:#fff;
	text-decoration:none;
}




.footer{
	width:100%;
}


.footer .main_logo{
	width:100%;
	background:#000;
	text-align:center;
}

.footer .main_logo img{
	width:150px;
}

.footer .copy{
	padding:30px 0;
	text-align:center;
	background:#000;
	color:#fff;
}

.footer .copy dt{
	font-size:90%;
	margin:0;
}

.footer .copy dd{
	font-size:60%;
	font-family:"Times New Roman", Times, serif;
	margin-left:0;
	margin:0;
	line-height:80%;
}
