@charset "utf-8";

/*=====================================================================
01. loading
======================================================================= */

#loading {
  overflow: hidden;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  pointer-events: none; }
  #loading img {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    transform: translate(-50%, -50%);
    width: 222px; }
  #loading::before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    background-color: #FFF;
    transform: translateX(0);
    transition: transform .6s ease-in-out;
    -webkit-transform: translateX(0);
    -webkit-transition: -webkit-transform .6s ease-in-out; }
  #loading::after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    background-color: #fff;
    animation: loadingOpening .6s ease-in-out forwards;
    -webkit-animation: loadingOpening .6s ease-in-out forwards; }
  #loading.loaded::before {
    transform: translateX(100%);
    -webkit-transform: translateX(100%); }


@keyframes loadingOpening {
  0% {
    transform: translateX(0);
    -webkit-transform: translateX(0); }
  100% {
    transform: translateX(100%);
    -webkit-transform: translateX(100%); } }



/*=====================================================================
slider
======================================================================= */

.bg-img ul {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;/*font-weight: normal;*/
}

.slides {
  position: relative;
}
.slides>li {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.slides>li.wipeCurrentSlide {
  animation-duration: 3.8s;
  animation-timing-function: linear;
  animation-fill-mode: both;
  animation-name: scaleAnim;
}
/*@media all and (-ms-high-contrast: none){
  .slides>li.wipeCurrentSlide {
    animation-name: none;
  }
}*/
.slides>li>img {
  width: 100%;
}

.img-change img {
  display: none;
}

@keyframes scaleAnim {
  0% {
    transform: scale(1.00) rotate(0.1deg);
  }
  100% {
    transform: scale(1.04) rotate(0.1deg);
  }
}


/*=====================================================================
#main-visual
======================================================================= */
#main-visual {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}
.iphone.portrait #main-visual,
.ipad.portrait #main-visual,
.android.portrait #main-visual {
  height: 32.68%;
}


/*.bg-img
------------------------------------------------------------------------ */
#main-visual .bg-img {
  width: 100%;
  height: 100%;
	overflow: hidden;
}
#main-visual .bg-img ul {
  width: 100%;
  height: 100%;
}
#main-visual .bg-img ul li {
  width: 100%;
  height:100%;
  background-size: cover;
  background-position: center center;
}



/*.main_txt
------------------------------------------------------------------------ */
#main-visual .main_txt {
	/*上下左右中央
------------------------------------------------------------------------ */
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 60%;
	text-align: center;
  height: 3.2rem;
/*------------------------------------------------------------------------ */
	z-index: 10;
}

#main-visual .main_txt img{
width: 400px;
	
}


/*.btn_scroll
------------------------------------------------------------------------ */

#main-visual .btn_scroll {
	overflow: hidden;
	position: absolute;
	bottom: 0;
	right: 30px;
	z-index: 99;
	width: 20px;
	height: 110px; 
}

#main-visual .btn_scroll .txt {
	font-family: "Palatino Linotype", "serif";
	font-style: italic;
  display: block;
	color: #FFF;
  transform: rotate(90deg);
  transform-origin: 0 100%;
  width: 110px;
  height: 20px;
  font-size: 10px;
  letter-spacing: 0.2em;
	margin: -20px 0 0 0;
  line-height: 1; }

#main-visual .btn_scroll a{
	text-decoration: none;
}
#main-visual .btn_scroll a:hover {
	opacity: 0.8;
	transition: 0.1s ease-out;
}


#main-visual .btn_scroll .bar {
  overflow: hidden;
  position: absolute;
  left: 0;
  bottom: 0;
  display: block;
  width: 1px;
  height: 110px;
  background-color: #FFF; }

 #main-visual .btn_scroll .bar i {
	display: block;
	position: absolute;
	width: 1px;
	background-color: #35318F; }


/*.pickup
------------------------------------------------------------------------ */
.pickup{
	width: 340px;
	height: 79px;
	padding: 30px;
	position: absolute;
	left: 0;
	bottom: 60px;
	background-color: rgba(255,255,255,0.96);
	border-radius: 0 9px 9px 0;
	z-index: 100;
}

.pickup .left{float: left; width: 213px; height: 20px;  margin-right: 20px;}
.pickup .left .ttl{float: left; width: 50%; height: 20px; font-size: 18px;  font-family: "Palatino Linotype", "serif"; color: #35318F;  }
.pickup .left .date{float: left; width: 50%; font-size: 11px; font-style: italic; text-align: right; color: #35318F;  height: 30px;  padding-top: 10px;}
.pickup .left .link{color: #000; width: 100%; margin-top: 0; font-size: 13px; line-height: 180%;}

.pickup .right{float: left; width: 107px; text-align: right;}

.pickup .right a  {
  overflow: hidden;
	display: block;
		width: 107px;
	height:  79px;
	margin: 0;
	padding: 0;
}

.pickup .right a  img {
	width: 107px;
	height:  79px;
	margin: 0;
	padding: 0;
  display: block;
  transition: 0.4s ease-out;
	overflow: hidden!important;
}
.pickup .right a img:hover {
  transform: scale(1.07) rotate(0.1deg);
  opacity: 0.6;
	transition: 0.2s ease-out;
}



/*=====================================================================
	# Navigation
======================================================================= */


.menu-line {display: none;}
#navigation{display: none;}
.global_nav_sp{display: none;}


/*.MEGA MENU
------------------------------------------------------------------------ */
#mdd_overlay{
background:#252568;
opacity:0;
position:fixed;
top:0px;
left:0px;
width:100%;
height:100%;
display:none;
z-index:100;
}

#mdd_nav_wrap {
	margin: 0 auto;
	width:950px;
	height: 92px;
	border-radius: 0 0 9px 9px;
	padding: 0 0 0 30px;
	background-color: #FFF;
	box-shadow: 0 0 8px rgba(0,0,0,0.1);
	position: relative;
}

#mdd_nav_wrap  h1 {width: 75px; position: absolute; top: 0; left: 30px;}
#mdd_nav_wrap  h1 img{width: 100%; height: auto; margin: 13px 0 10px 0;;}


/* Level1
------------------------------------------------------------------------ */
ul.mdd_lv1 {
list-style:none;
margin:0;
padding:0; 
z-index:200;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
	
	display: flex;
	justify-content: center;
}

ul.mdd_lv1 li {
float: left;
	display: table;
	margin: 0 20px;
}

ul.mdd_lv1 li a {
display: table-cell;
	vertical-align: middle;
color:#000;
height:92px;
	font-size: 14px;
	font-family: 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN','メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	letter-spacing:.03em;
	text-decoration: none;
}

a.hoverline  {
position: relative;
}


a.hoverline::after {
  position: absolute;
  bottom: 1px;
  left: 0;
  content: '';
  width: 100%;
  height: 4px;
  background: #35318F;
  transform: scale(0, 1);
  transform-origin: center top;
  transition: transform .3s;
}
a.hoverline:hover::after {
  transform: scale(1, 1);
}


/* Level2
------------------------------------------------------------------------ */
ul.mdd_lv2{
display:none;
position:absolute;
top:92px;
left:0px;
background-color: #3A3AAD;
width:840px;
padding:70px 70px 60px 70px;
list-style-position:outside;
color:#000;
margin:0;
}

/*ul.mdd_lv1 li:hover ul.mdd_lv2 {
display:block;
}*/
ul.mdd_lv2 p{padding: 0 0 0 35px; margin: 20px 0 0 0; color: #FFF; font-size: 13px;  position: relative;}
ul.mdd_lv2 p:before{position: absolute;  content: "";  top: 9px; left: 0; width: 18px; height: 2px;  background-color: #FDD000;}

ul.col2 li {
width: 420px;
height: 150px;
padding: 0;
margin: 0;
}

ul.col2 li img {
width: 420px;
height: 150px;
overflow: hidden;
}


ul.col3 li {
width: 280px;
height: 150px;
padding: 0;
margin: 0;
}

ul.col3 li img {
width: 280px;
height: 150px;
overflow: hidden;
}


ul.col4 li {
width: 210px;
height: 150px;
padding: 0;
margin: 0;
}

ul.col4 li img {
width: 210px;
	height: 150px;
overflow: hidden;
}



/*
ul.mdd_lv2 li a{
height:auto;
background-color: none;
width: auto;
background-color: #ffffff;
color: #000;
padding-top: 10px;
padding-right: 0px;
padding-bottom: 10px;
padding-left: 0px;
}
ul.mdd_lv2 li a:hover{
background-color: #ffffff;
color: #ccc;
}
*/

ul.mdd_lv2 li a .photo  {
  overflow: hidden;
}

ul.mdd_lv2 li a .photo  img {
  display: block;
  transition: 0.4s ease-out;
}
ul.mdd_lv2 li a .photo img:hover {
  transform: scale(1.07) rotate(0.1deg);
  opacity: 0.6;
	transition: 0.2s ease-out;
}




/*=====================================================================
02. layout
======================================================================= */


#wrap {
  overflow: hidden;
  position: relative;
  box-sizing: border-box;
  width: 100%;
  min-width: 980px;
  padding: 0;}

#wrap_detail {
  overflow: hidden;
  position: relative;
  box-sizing: border-box;
  width: 100%;
  min-width: 980px;
  padding: 0;}
 

.contentsarea{
	position: relative;
	width: 980px;
	margin: 0 auto;
}



/*** header ***/
#header {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
  width: 100%;
  min-width: 980px; }



/*=====================================================================
03. Index
======================================================================= */


/* News block
------------------------------------------------------------------------ */

.newsblock{width: 980px;  margin: 60px auto 0 auto; position: relative;}

.recentnews{
	width:790px;
	margin: 0 auto 30px auto;
	position: relative;
	
}

.recentnews a{
display: block;	
	width:790px;
	height: 68px;
	background-color: #F4F4F4; 
	border-radius: 34px;
	background-image: url("../images/arrow_news.png");
	background-size: 34px auto;
	background-position: 22px 18px;
	background-repeat: no-repeat;
	transition: all 0.3s ease;
}

.recentnews a:hover{
	background-color:#EFEFEF;
	transition: all 0.1s ease;
}

.recentnews a:hover .ttl{
	text-decoration: none;
}

.recentnews .txt{position: absolute; top: 24px; left:80px; text-decoration: none;}
.recentnews .txt .date{font-size: 12px; font-style: italic;}
.recentnews .txt .ttl{font-size: 13px; text-decoration: underline;}
.recentnews .txt .ttl:hover{text-decoration: none;}

.recentnews  .pcnone{display: none;}
.newsblock  .spnone{display: none;}
.newsblock  .pcnone{display: none;}

/* Btn_area block
------------------------------------------------------------------------ */

.btn_area{width: 980px; height: 25px; margin: 60px auto 0 auto; position: relative;}


.btn_category {width: 140px; font-size:13px; letter-spacing:.04em; position: absolute; top:0; right: 0;}

.btn_category a{display: block; color: #35318F; text-decoration: none; }
.btn_category a::after {
	content: "";
	display: block;
	border-bottom: 1px solid #35318F;
	transition: all .3s ease;
	width: 140px;
	height: 25px;
	background-image: url(../images/arrow_news.svg);
	background-repeat: no-repeat;
	background-size: 12px auto;
	background-position: -20px 0;

}

.btn_category a:hover::after {
  width: 100%;
	height: 25px;
	background-image: url(../images/arrow_news.svg);
	background-repeat: no-repeat;
	background-size: 12px auto;
	background-position: 0 0;

}

.btn_category .andmore {
position: relative;
	height:6px;
	margin: 0; padding: 0;
	transition: all .3s ease;
	transition-delay: 0;
 	left: 0px;
}

.btn_category a:hover .andmore {
	position: relative;
	height:6px;
	margin: 0; padding: 0;
	transition: all .35s ease;
	transition-delay: 0.06s;
	left: 30px;
}


.btn_area02{width: 980px;  height: 36px;  margin: 80px auto 80px auto; position: relative;}

.btn_category02 {  font-size:12px;  letter-spacing:.04em; position: absolute; top: 0; right: 0; }

.btn_category02 a{
	 width: 200px; height: 36px; border-radius: 18px; 
	background-color: #EFEFF6; 
	text-align: center; text-decoration: none;color: #35318F; 
	background-image: url("../images/arrow_news.png");
	background-size: 20px auto;
	background-position: 10px 8px;
	background-repeat: no-repeat;
	transition: all 0.3s ease;
/*　box要素縦中央 */
 display: -webkit-flex;
 display: flex;
 -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
 align-items: center; /* 縦方向中央揃え */
 -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
 justify-content: center; /* 横方向中央揃え */

}

.btn_category02 a:hover{background-color: #DCDCEA; transition: all 0.1s ease;}
.btn_category02 a p{margin-left: 12px;}



/* vertical_ttl
------------------------------------------------------------------------ */

.newsblock .vertical_ttl{
	width: 260px;
	color: #35318F;
	font-size: 13px;
	font-family: "Palatino Linotype", "serif";
	font-style: italic;
	font-weight: bold;
	position: relative;
	text-align: right;
	transform: rotate(-90deg);
	top: 140px;
	left: -107px;
}

.newsblock .vertical_ttl:before{
	content: "";
	width: 260px;
	height: 3px;
	background-color: #35318F;
	position: absolute;
	top: -14px;
	left: 0;
}


.detai_body .vertical_ttl{
	width: 260px;
	color: #35318F;
	font-size: 13px;
	font-family: "Palatino Linotype", "serif";
	font-style: italic;
	font-weight: bold;
	position: relative;
	text-align: right;
	transform: rotate(-90deg);
	top: 140px;
	left: -237px;
}

.detai_body .vertical_ttl:before{
	content: "";
	width: 260px;
	height: 3px;
	background-color: #35318F;
	position: absolute;
	top: -14px;
	left: 0;
}


/* index message
------------------------------------------------------------------------ */

.index_message{
	margin: 60px 0 0 0 ;
	width: 100%;
	min-width: 1090px;
	display: flex;
}

.index_message .col01{
	width: 110px;
	height: 10px;
}
.index_message .col02{
	width: 100%;
	background-color: #35318F;
	padding-bottom: 70px;
}

.index_message .col02 .left{
float: left;
width: 65%;
padding-top: 70px;
}

.index_message .col02 .left .ttl{
	margin-left: 100px;
}
.index_message .col02 .left .ttl img{
	width: 325px;
}

.index_message .col02 .left .txt{
	margin-left: 156px;
	color: #FFF;
	font-size: 15px;
	line-height: 280%;
	font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic,"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 500;
}

.index_message .col02 .left .txt .second{
	margin-top: 20px;
	
}

.index_message .col02 .right{
float: left;
width: 35%;
	padding-top: 140px;
}

.index_message .col02 .right img{
width: 100%;
}


.index_message_sp{display: none;}


/* index business
------------------------------------------------------------------------ */

.index_business{
	margin: 80px 0 0 0 ;
	width: 100%;
	min-width: 980px;
	display: flex;
}

.index_business .col01{
	width: 60px;
	height: 10px;
}
.index_business .col02{
	width: 100%;
	background-color: #FFCE00;
	padding: 0 0 50px 50px;
	margin:0  -5px 0 0;
	position: relative;
}

.index_business .col02 .ttl{
	color: #35318F;
	position: absolute;
	top: -50px;
	left: 0;
	z-index: 100;
}

.index_business .col02 .en{
	font-family: "Palatino Linotype", "serif";
	font-weight: bold;
	font-size: 22px;
	background-color: #FFCE00;
	padding: 10px 30px 10px 30px;
}

.index_business .col02 .jp{
	width: 110px;
	text-align: center;
	padding: 10px 0 10px;
	font-size: 12px;
	background-color: #FFCE00;

}


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


.index_business  ul li{
	width: 33.33333%;
	float: left;
		position: relative;
	background-color: #35318F;
}

.index_business  ul li a{
	width: 100%;
	/*　box要素縦中央 */
 display: -webkit-flex;
 display: flex;
 -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
 align-items: center; /* 縦方向中央揃え */
 -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
 justify-content: center; /* 横方向中央揃え */
}

.index_business ul li a  {
  overflow: hidden;
}

.index_business ul li a   img.hoverimg {
  display: block;
  transition: 0.4s ease-out;
}

.index_business ul li a  img.hoverimg:hover {
  transform: scale(1.07) rotate(0.1deg);
  opacity: 0.15;
	transition: 0.2s ease-out;
}

.index_business  ul li p{
	width: 100%;
	text-align: center;
	position: absolute;
		color: #FFF;
	font-size: 18px;
	text-decoration: none;
}

.index_business  ul li img{
	width: 100%;
	float: left;
	opacity: 0.5;
}

.index_business  .arrow  {
  position: absolute;
	bottom: 30px;
	left: 42%;
	width: 60px; height: 60px;
}

.index_business  .arrow img  {
	width: 60px; opacity: 1; 
}


.index_business_sp{display: none;}


/* bnr area
------------------------------------------------------------------------ */

.bnr_area_sp{display: none;}

.bnr_area{
	width: 980px;
	height: 380px;
	margin: 80px auto 50px auto;
	background-color: #35318F;
	position: relative;
	}

.bnr_area .bgarea{
	position: absolute;
	top: 50px;
	left: 50px;
	z-index: -1;
	width: 980px;
	height: 380px;
	background-color: #F4F4F4;
}

.bnr_area .bn{
	width: 940px;
	height: 340px;
	background-image: url("../images/bnr_recruit.jpg");
	background-size: 980px 380px;
	padding: 20px;
}
		
.bnr_area .bn:hover{opacity: 0.9;}

.bnr_area .bn a{  color: #fff; text-decoration: none;}
		
.recruit_bnr {
  position: relative;
	width: 940px;
	height: 340px;
  display: block;
  border: 2px solid transparent;
  text-align: center;
  text-decoration: none;
  outline: none;
	  transition: 0.2s ease-in-out;
		background-image: url("../images/bnr_arow.png");
	background-size: 27px 46px;
	background-repeat: no-repeat;
	background-position: right 40px top 150px;
}

.recruit_bnr .en{font-size: 28px;  font-family: "Palatino Linotype", "serif"; font-weight: bold; letter-spacing: .03em;   margin-top: 40px; }
.recruit_bnr .jp{font-size: 11px; letter-spacing: .03em;  margin-top: 5px; }
.recruit_bnr .title{
	margin-top: 30px;
	font-size: 21px;
	font-weight: bold;
	line-height: 220%;
	font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic,"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
	letter-spacing: .08em;
}

.recruit_bnr::before,
.recruit_bnr::after,
.recruit_bnr span::before,
.recruit_bnr span::after {
  position: absolute;
  z-index: 2;
  content: '';
  width: 0;
  height: 0;
  border: 2px solid transparent;
transition: 0.3s ease-in-out;
  visibility: hidden;
  box-sizing: content-box;
}
.recruit_bnr::before {
  top: -2px;
  left: -2px;
  border-left-color: #FFF;
}
.recruit_bnr::after {
  bottom: -2px;
  right: -2px;
  border-right-color: #FFF;
}
.recruit_bnr span::before {
  bottom: -2px;
  left: -2px;
  border-bottom-color: #FFF;
}
.recruit_bnr span::after {
  top: -2px;
  right: -2px;
  border-top-color: #FFF;
}
.recruit_bnr:hover {
  color: #FFF;
}
.recruit_bnr:hover::before,
.recruit_bnr:hover::after {
  visibility: visible;
  height: 100%;
}
.recruit_bnr:hover span::before,
.recruit_bnr:hover span::after {
  visibility: visible;
  width: 100%;
}


/*=====================================================================
04. Detail
======================================================================= */


#contents_area{width: 980px; margin: 150px auto 0 auto;}
#contents_visual{width: 100%; margin: 0; height: 470px; overflow: hidden; position: relative;}

#contents_visual.about{
    background-image: url("../images/mainvisual_detail01.jpg"); 
    background-size: 100% auto; background-repeat: no-repeat;}
#contents_visual.business{
    background-image: url("../images/mainvisual_detail02.jpg"); 
    background-size: 100% auto; background-repeat: no-repeat;}
#contents_visual.products{
    background-image: url("../images/mainvisual_detail03.jpg"); 
    background-size: 100% auto; background-repeat: no-repeat;}
#contents_visual.recruit{
    background-image: url("../images/mainvisual_detail04.jpg"); 
    background-size: 100% auto; background-repeat: no-repeat;}

#contents_visual .detail_ttl{position: absolute; left: 60px; top: 150px;}
#contents_visual .detail_ttl .en{
    font-size: 25px;
    font-weight: bold;
	letter-spacing: .04em;
	color: #35318F;
	font-family: "Palatino Linotype", "serif";
    background-color: #FFF;
    padding: 10px 20px;
}
#contents_visual .detail_ttl .jp{
    font-size: 13px;
	letter-spacing: .02em;
	color: #35318F;
    background-color: #FFF;
     padding: 10px 20px 15px 20px;
}


.detai_section{width: 980px; margin: 80px auto 0 auto;}
.detai_body{width: 720px; margin: 70px auto 0 auto; position: relative;}

.detai_body dl{width: 720px; margin: 0 0 -40px 0; }
.detai_body dt{padding: 35px 0 35px 0; margin: 0 20px 0 0; width: 160px; float: left;  border-top: 1px #35318F solid; font-size: 14px; font-weight: bold; color: #35318F; line-height: 200%;}
.detai_body dd{padding: 35px 0 35px 0; width: 500px; float: left; border-top: 1px #E5E5E5 solid; font-size: 13px; color: #000; line-height: 240%;}


.detail_btn ul{margin: 0; padding: 0; }
.detail_btn li{ float: left; margin-right: 2px; text-align: center; font-size: 14px; letter-spacing: .03em;}

.detail_btn a{  position: relative; display: block; text-decoration: none; border-bottom:2px solid  #E5E5E5; padding:6px 0 42px; 
background-image: url("../images/arrow_detail02.png"); background-size: 26px 26px; background-position: 0 0; background-repeat: no-repeat;}

.detail_btn a.current{ background-image: url("../images/arrow_detail01.png"); }

.detail_btn a::after{
  position: absolute;
  bottom: -2px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #35318F;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform .35s ease;
}
.detail_btn a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}

.detail_btn a:hover {background-image: url("../images/arrow_detail01.png"); }


/* news
------------------------------------------------------------------------ */
.news_section{width: 780px; margin:0 auto 0 auto; position: relative;}

.news_ttl{color: #35318F; font-size: 12px; text-align: center; margin: 0 0 40px 0;}
.news_ttl h2{
    font-size: 30px;
	letter-spacing: .08em;
	color: #35318F;
	font-family: "Palatino Linotype", "serif";
    margin-bottom: 8px;
    }

.cnt_ttl{ border-top: 3px solid #35318F; padding-top: 35px; color: #35318F;  font-size: 18px; font-weight: bold;}
.cnt_date{font-size: 11px; margin-top: 10px;}
.cnt_body{font-size: 14px; line-height: 200%; margin: 35px 0 60px 0;}
.cnt_body img{max-width:780px; height: auto; margin-bottom: 30px;}

.news_btn_area{width: 780px; height: 25px; margin: 0 auto 0 auto; position: relative;}


/* about
------------------------------------------------------------------------ */
.detail_btn .about li{width: 243px;}
.detail_btn .about li a{width: 243px;}

.about_message{
	margin: 80px 0 0 0 ;
	width: 100%;
	min-width: 980px;
	display: flex;
}

 .about_message .sp_image{display: none;}


.about_message .col01{
	width: 110px;
	height: 10px;
}
.about_message .col02{
	width: 100%;
	background-color: #35318F;
	padding-bottom: 70px;
    margin-right: -10px;
}

.about_message .col02 .left{
float: left;
width: 55%;
padding-top: 80px;
}

.about_message .col02 .left .ttl{
    color: #FFF;
    font-size: 30px;
    font-weight: bold;
    letter-spacing: .18em;
	margin:0 0 40px 100px;
}

.about_message .col02 .left .txt{
	margin-left: 100px;
	color: #FFF;
	font-size: 14px;
	line-height: 240%;
	font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic,"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 500;
}

.about_message .col02 .left .txt .second{margin-top: 20px;}

.about_message .col02 .right{
float: left;
width: 45%;
	padding-top: 140px;
}

.about_message .col02 .right img{width: 100%;}


/* company
------------------------------------------------------------------------ */
.detai_body dd .adress{width: 100%; display: table; font-size: 12px;}
.detai_body dd .adress .left{display: table-cell; width: 36%;}
.detai_body dd .adress .right{display: table-cell; width: 64%;}
.detai_body dd .adress_sp{display:none;}

.company_img{margin:0 0 80px 0;}


/* access
------------------------------------------------------------------------ */
.detai_body .access{width: 720px; margin: 0 auto;}
.detai_body .access iframe{margin-bottom: 40px;}

.access_name{background-color: #35318F; color: #FFF; font-size: 13px; margin:0 0 40px; padding: 10px 15px 8px 15px; display: inline-block;}
.access_body{font-size: 13px; line-height: 180%; color: #35318F;}
.access_mt{margin-top: 60px;}


/* recruit
------------------------------------------------------------------------ */
.detail_btn .recruit li{width: 488px;}
.detail_btn .recruit li a{width: 488px;}

.recruit_ttl{font-size:24px; line-height: 200%; margin-bottom: 30px; color: #35318F; text-align: center; letter-spacing: .08em; font-weight: bold;}

.recruit_body{font-size:14px; line-height: 240%; text-align: center;}
.recruit_body p{margin-bottom: 60px; }
.recruit_body .spnone{display: inherit;}

.recruit_name{background-color: #35318F; color: #FFF; font-size: 13px; margin:0 0 10px 0; padding: 10px 15px 8px 15px; display: inline-block;}
.recruit_name02{background-color: #35318F; color: #FFF; font-size: 13px; margin:0 0 40px 0; padding: 10px 15px 8px 15px; display: inline-block;}
.recruit_cate{font-size:15px; color: #35318F; padding: 16px 17px; margin-bottom: 60px; border: 1px solid #35318F;}

.recruit_ttl02{font-size:18px; color: #35318F; font-weight: bold;  letter-spacing: .08em; margin: 40px 0 0 0; padding: 0 0 0 40px; position: relative;}
.recruit_ttl02:before{content: ""; width: 25px; height: 2px; background-color: #FDD000; position: absolute; top: 10px; left: 0; }

.recruit_body02{font-size:13px; line-height: 200%; margin: 20px 0 0 40px;}
.recruit_margin{margin-top:80px;}



/* business
------------------------------------------------------------------------ */
.detail_btn .business li{width: 324px;}
.detail_btn .business li a{width: 324px;}

.business_ttl01{width: 100%; margin-bottom: 80px;}
.business_ttl01 .left{width: 50%; float: left;}

.business_ttl01 .left .ttl{font-size: 26px; font-weight: bold; letter-spacing: .12em; color: #35318F; line-height: 190%; position: relative; padding-left:30px; }
.business_ttl01 .left .ttl:before{content:""; height: 80px; width: 2px; background-color: #FDD000; position: absolute; top: 10px; left: 0;}

.business_ttl01 .right{width: 50%; float: left; font-size:14px; line-height: 220%; }

.business_mode{width: 100%; margin-bottom: 140px;}
.business_mode .col01{width: 0; height: 0; background-color: aqua;}
.business_mode .col02{background-color: #FFF; width: 980px; margin: 0 auto; padding: 0;}
.business_mode .col03{width: 200%; height: 100%; background-color: #F4F4F4; position: absolute; top: 50px; left: -50px;}

.business_ttl02{font-size:26px; color: #35318F; font-weight: bold;  letter-spacing: .08em; margin: 0 0 0 0; padding: 0 0 0 40px; position: relative;}
.business_ttl02:before{content: ""; width: 25px; height: 2px; background-color: #FDD000; position: absolute; top: 14px; left: 0; }
.business_body01{font-size:13px; line-height: 200%; margin: 40px 0 0 0;}

.business_btnarea{width: 100%; margin-bottom: 80px;}
.business_btnarea  a{
	float: left;
    font-size: 11px;
    font-weight: bold;
	 width: 162px; 
	height: 34px; 
	margin-right: 24px;
	border-radius: 17px; 
	background-color: #EFEFF6; 
	text-align: center; text-decoration: none;color: #35318F; 
	transition: all 0.3s ease;
/*　box要素縦中央 */
 display: -webkit-flex;
 display: flex;
 -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
 align-items: center; /* 縦方向中央揃え */
 -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
 justify-content: center; /* 横方向中央揃え */

}

.business_btnarea  a:last-child{margin-right: 0;}
.business_btnarea  a:hover{background-color: #DCDCEA; transition: all 0.1s ease;}

.business_cate{font-size:15px; color: #35318F; padding: 16px 17px; margin:50px 0 40px; border: 1px solid #35318F;}
.business_img{margin:50px 0 0;}
.business_body02{font-size:13px; line-height: 200%; margin: 0 0 0 0;}


/* products
------------------------------------------------------------------------ */
.products_body01{font-size:13px; line-height: 200%; margin: 40px 0 0 0;}



/* contact
------------------------------------------------------------------------ */
.contact_section{width: 720px; margin:0 auto 0 auto; position: relative;}
.contact_cate{font-size:15px; color: #35318F; padding: 16px 17px; margin-bottom: 30px; border: 1px solid #35318F;}
.contact_body{font-size:13px; line-height: 200%; margin: 0 0 0 0;}
.contact_body span{font-weight: bold;}



.form_mustarea{width: 100%; margin: 0 auto 0 auto;}

.form_must{width:60px; text-align: left; float: right; background-image: url(../images/form_listimage.png); background-size: 9px 9px; background-repeat: no-repeat; background-position: 0 4px; padding:2px 0 0 18px; font-size: 12px; letter-spacing:.08em; margin:0 -10px 30px 0; color:#35318F;}

.formarea{width: 720px; margin: 0 auto 0 auto ; etter-spacing:.08em;}

.formname {
	width:161px;
	float: left;
	margin:0 0 0 0;
	line-height:140%;
	color:#35318F;
	background-image: url(../images/form_listimage.png);
	background-size: 9px 9px;
	background-repeat: no-repeat;
	background-position: 0 17px;
	padding:8px 0 0 25px;
}


.formname02 {
	width:161px;
	float: left;
	margin:0 0 0 0;
	line-height:140%;
	color:#35318F;
	padding:8px 0 0 25px;
}

.formname .en,.formname02 .en{font-size: 17px; font-family: "Palatino Linotype", "serif"; letter-spacing: .04em; font-weight: bold; }
.formname .jp,.formname02 .jp{font-size: 11px;}
.formname .error,.formname02 .error{font-size: 12px!important;}


  .formborder input {
	width: 492px;
	float: left;
	padding: 20px;
	color:#35318F;
	border: 1px solid #35318F;
	font-size: 100%;
	margin-bottom: 50px;
}


  .formborder textarea {
	width: 492px;
	padding: 20px;
	color:#35318F;
	border: 1px solid #35318F;
	font-size: 100%;
}


.btn_submit {
	width:350px;
	margin: 50px auto 0 auto ;
}

.btn_submit input {
	width:350px;
	text-align: -9999px;
	height:90px;
	background-image:url(../images/form_submit.png);
	background-size:350px 90px;
	border: none;
    background-position: 0 0;
    background-color: transparent;
	cursor: pointer; 
}

.thankstitle{font-size: 20px; font-weight: bold; text-align: center; color:#35318F; margin-bottom: 10px;}
.thanksbody{font-size: 13px; line-height: 240%; text-align: center; color:#35318F; margin-bottom: 40px;}

/*=====================================================================
05. Footer
======================================================================= */


#footer{width: 100%;  min-width: 980px;position: relative; margin: 210px 0 0 0; display:table;  table-layout:fixed; }

#footer .left{width:230px;  display:table-cell; background-color: #F9F9F9; padding: 50px 60px 60px 60px;}
#footer .left h2{width: 160px;}
#footer .left h2 img{width: 100%;}
#footer .left .adress{font-size: 12px; line-height: 200%; margin: 20px 0 0 0;}


#footer .btnarea{width: 252px;  margin: 90px 0 0 0;}

#footer .btnarea .btn{font-size: 12px;}

#footer .btnarea .btn  a{
	float: left;
	 width: 106px; 
	height: 28px; 
	margin-right: 20px;
	border-radius: 14px; 
	background-color: #EFEFF6; 
	text-align: center; text-decoration: none;color: #35318F; 
	transition: all 0.3s ease;
/*　box要素縦中央 */
 display: -webkit-flex;
 display: flex;
 -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
 align-items: center; /* 縦方向中央揃え */
 -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
 justify-content: center; /* 横方向中央揃え */

}

#footer .btnarea .btn  a:hover{background-color: #DCDCEA; transition: all 0.1s ease;}


#footer .snsarea{width: 65px;  margin-top:40px; }
#footer .snsarea .facebook{margin-right: 37px; float: left;}
#footer .snsarea .facebook img{width: 9px; height: auto;}
#footer .snsarea .insta{float: left;}
#footer .snsarea .insta img{width: 19px; height: auto;}



#footer .right{width: 75%; min-width: 720px;  display:table-cell;  vertical-align: top; background-color: #35318F; color: #FFF; padding: 60px; list-style: none;}
#footer .menuarea {margin: 0;}

#footer .menuarea a{  position: relative; display: inline-block; text-decoration: none;}
#footer .menuarea a::after{
  position: absolute;
  bottom: -8px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: #FFF;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform .2s;
}
#footer .menuarea a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}

#footer .menuarea ul{display: -webkit-flex; display: flex; margin: 0; padding: 0; list-style: none;}
#footer .menuarea ul li{font-size: 12px; width:150px; list-style: none; margin:0 0 0 0 ;}
#footer .menuarea ul li .ttl{font-size: 14px; margin-bottom: 30px; font-weight: bold;}

#footer .menuarea ul li .submenu{margin: 0; padding: 0; display: inherit;}
#footer .menuarea ul li .submenu li{margin-bottom: 18px;}
#footer .menuarea ul li a{color: #FFF; text-decoration: none;}

#footer .menuarea ul .mr01{margin-right: 50px;}
#footer .menuarea ul .mr02{margin-right: 40px;}
#footer .menuarea ul .mr03{margin-right: 20px;}

#footer .footarea{width: 100%; text-align: right; margin-top: 60px;}
#footer .footarea .btn{width: 100%; margin-bottom: 40px; text-align: right; }
#footer .footarea .btn img{width: 130px;}
#footer .footarea .copyright{font-size: 10px; color: #FFF; /*transform: scale(0.6);*/}



/* Page top
------------------------------------------------------------------------ */

#pageTop {
	width:250px;
	margin: 0 0 0 0;
	text-align: center;
	z-index: 100;
    position: fixed;
    right: 0;
        bottom: 0;
}

#pageTop a {
	width: 250px;
	height: 80px;
	position: relative;
	z-index: 1;
		font-size: 12px;
	letter-spacing: .08em;
	background-color: #FFCE00;
	color: #35318F;
	font-family: "Palatino Linotype", "serif";
	text-decoration: none;
/*　box要素縦中央 */
 display: -webkit-flex;
 display: flex;
 -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
 align-items: center; /* 縦方向中央揃え */
 -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
 justify-content: center; /* 横方向中央揃え */
}
#pageTop a:hover{
	color: #FFF;

}
#pageTop a::after {
	position: absolute;
	content: "";
	width: 0;
	height: 100%;
	top: 0;
	right: 0;
	z-index: -1;
	background-color: #35318F;
	transition: all 0.45s cubic-bezier(0.215, 0.61, 0.325, 1) 0s;
}
#pageTop a:hover:after {
	left: 0%;
	right: auto;
	width: 100%;
	
}




/* 404
------------------------------------------------------------------------ */

.notfound_btn{width: 200px; margin: 0 auto  80px auto;}

.notfound_btn  a{
	 width: 200px; 
	height: 36px; 
    font-size: 14px;
	margin-right: 20px;
	border-radius: 18px; 
	background-color: #EFEFF6; 
	text-align: center; text-decoration: none;color: #35318F; 
	transition: all 0.3s ease;
/*　box要素縦中央 */
 display: -webkit-flex;
 display: flex;
 -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
 align-items: center; /* 縦方向中央揃え */
 -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
 justify-content: center; /* 横方向中央揃え */

}

.notfound_btn  a:hover{background-color: #DCDCEA; transition: all 0.1s ease;}