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

/*************************************
  .page-title calsel
*****************************************/

#top .page-title-wrapper { padding:85px 0 0 0;background-color:#FFFFFF;width:100%;height:100%; position: relative;overflow: hidden; }
#top .page-title-wrapper:before {  
	display: none;
}
#top .page-title-wrapper:after { 
	display: none;
}
#top .page-title-wrapper .carousel-inner { height:80vh; } 
#top .page-title-wrapper .carousel-item { background-color: #FFFFFF; height:100%;}
#top .page-title-wrapper figure { height:100%;}
#top .page-title-wrapper #main01 { background: url(/images/top/main01.jpg) center top no-repeat; background-size:cover; } 
#top .page-title-wrapper #main02 { background: url(/images/top/main02.jpg) center top no-repeat; background-size:cover; } 
#top .page-title-wrapper #main03 { background: url(/images/top/main03.jpg) center top no-repeat; background-size:cover; } 
#top .page-title-wrapper .carousel-caption { top: 12%;}
#top .page-title-wrapper .carousel-caption h5 { font-family: "游明朝 Demibold","ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif"; text-shadow:1px 1px 5px #7d7d7d; font-size: 32px; line-height: 1.4;}
html[lang="zh"] #top .page-title-wrapper .carousel-caption h5{font-family: Georgia, "Times New Roman", Times, "Hiragino Sans GB W3","STXihei","Microsoft YaHei", "微软雅黑",'SimSun', sans-serif;}

html[lang="zh"] #top .page-title-wrapper .carousel-caption h5 span { font-size:28px;}
#top .carousel-control-next, .carousel-control-prev { height:80%; }

@media only screen and (min-width: 992px) {
	#top .page-title-wrapper { padding:115px 0 0 0; height:738px; }
	#top .page-title-wrapper .carousel-inner { height:100%;}
	#top .page-title-wrapper .carousel-item { height:623px;}
	#top .page-title-wrapper figure { height:90%;}
	#top .page-title-wrapper .carousel-caption h5{ font-size: 42px; line-height: 1.4;}
	#top .page-title-wrapper .carousel-caption { top: 25%;}
	#top .carousel-indicators { bottom: 20%; }
	#top .page-title-wrapper .mask { display:block;position:absolute; bottom:5%; width:100%; height:auto; z-index: 50; }
}

#main-wrapper > .container {
    padding: 0 0 50px;
}

/*************************************
  newsbox
*****************************************/
#top #main-inner > section.top-news-box{ position:relative;}
#top #main-inner > section.top-news-box h2.catch-copy {
	color:#005bac;
	font-weight:bold;
	text-align: center;
	font-size: 52px;
	display: inline-block;
	width:auto;
}
#top #main-inner > section h2.catch-copy span {
    display: block;
	color:#005bac;
}
#top #main-inner > section.top-news-box .btn.more { display: block; margin:1em auto;width:6em;}

@media only screen and (min-width: 768px) {

		#top #main-inner > section h2.catch-copy h1 {
			transform: skewX(150deg);
			border-left:25px solid #005bac; 
			padding-right:25px;
			text-align: left;
			font-size: 48px;
		}
		#top #main-inner > section h2.catch-copy h1 span {
			transform: skewX(-150deg);
			padding-left: 0.5em;
		}
	
}
@media only screen and (min-width: 992px) {

	#top #main-inner > section h2.catch-copy h1 {
	text-align: left;
	}
	#top #main-inner > section.top-news-box .btn.more { position: absolute; top:1em; right:0;margin:0;}
}

/*************************************
  カルーセル
*****************************************/

figure.slack-box {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float: left;
  overflow: hidden;
  margin: 10px 2%;
  /*width: 100%;*/
  color: #ffffff;
  text-align: left;
  font-size: 14px;
}
figure.slack-box * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
figure.slack-box img {
  max-width: 100%;
  vertical-align: top;
}
figure.slack-box figcaption {
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
figure.slack-box:hover figcaption {
	background-color: rgba(0, 0, 0, 0);
}
figure.slack-box h3 {
  text-align: center;
  font-size: 1.3em;
  padding: 10px;
  margin: 0;
  font-weight: 400;
}
figure.slack-box:before {
  background: rgba(0, 0, 0, 0.6);
  content: "";
  left: 50%;
  right: 50%;
  bottom: 0;
  top: 0;
  position: absolute;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
figure.slack-box .icon {
  position: absolute;
  font-weight: normal;
  left: 50%;
  top: 40%;
  -webkit-transform: translate(-50%, -50px);
  transform: translate(-50%, -50px);
  opacity: 0;
}
figure.slack-box a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
  z-index: 1;
}
figure.slack-box:hover:before,
figure.slack-box.hover:before {
  left: 0;
  right: 0;
}
figure.slack-box:hover .icon,
figure.slack-box.hover .icon {
  opacity: 1;
}
slick-prev:before,
  .slick-next:before {
    font-family: "slick";
    font-size: 20px;
    line-height: 1;
    color: #212529;
    opacity: 0.75;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    }

/*************************************
  100年の歴史
*****************************************/

.kyosan100st-wrapper { 
	width:100%; 
	height:600px; 
	background: url(/images/top/bg_100story.jpg) no-repeat center top;
	position: relative;
	background-size: cover;
	margin-top:50px;
}
.kyosan100st-wrapper .mask { position: absolute; width:100%; bottom:-1px;}
.kyosan100st-wrapper h2 { text-align: center; position:absolute; top:40%;font-family: "游明朝 Demibold","ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif"; text-shadow:1px 1px 5px #7d7d7d; font-size: 36px; line-height: 1.4; color:#FFFFFF;}
.kyosan100st-wrapper .d-flex{ height:100%;}
.kyosan100st-wrapper .d-flex img{ width:90%;}
 @media only screen and (min-width: 992px) {
	.kyosan100st-wrapper .d-flex img{ width:auto; max-width:100%;}
	.kyosan100st-wrapper h2 { font-size: 62px; }
}

/*************************************
  しろまるバナー
*****************************************/

#main-wrapper .btm-banner-wrapper { padding-top:60px; }
#main-wrapper .btm-banner-wrapper .container-wrapper { width:100%;  }
#main-wrapper .btm-banner-wrapper .container-wrapper .container { display: flex; align-items: stretch; flex-flow:row wrap;}
#main-wrapper .btm-banner-wrapper .container-wrapper .container a {color:#FFFFFF; text-decoration: none; width:100%; }
#main-wrapper .btm-banner-wrapper .container-wrapper .container a * { -webkit-transition: all 0.25s ease; transition: all 0.25s ease;}
#main-wrapper .btm-banner-wrapper .container-wrapper .container a .box { text-align: center; padding:15px 0 30px;position:relative; }
#main-wrapper .btm-banner-wrapper .container-wrapper .container a .box h4 { font-size:14px; color:#000000;margin-top:1em;}
#main-wrapper .btm-banner-wrapper .container-wrapper .container a .box div.icon { 
	background-color: #FFFFFF; 
	border-radius:50%;
	width:255px; 
	height:255px;
	display:inline-flex;
    align-items: center;
    justify-content: center;
	margin:0 auto;
	box-shadow: 0 0 15px rgba(0,0,0,0.25);
}
#main-wrapper .btm-banner-wrapper .container-wrapper .container a:hover .box .icon { background-color:#00479d;  }
#main-wrapper .btm-banner-wrapper .container-wrapper .container a:hover .box h4 { color:#FFFFFF;}
@media only screen and (min-width: 768px) {
	#main-wrapper .btm-banner-wrapper .container-wrapper .container {flex-flow: wrap; justify-content: space-between; align-items: stretch;}
	#main-wrapper .btm-banner-wrapper .container-wrapper .container a{ width:50%;}
	#main-wrapper .btm-banner-wrapper .container-wrapper .container a .box div.icon { 
	margin:0 auto 15px;
	
	}

@media only screen and (min-width: 992px) {
	#main-wrapper .btm-banner-wrapper .container-wrapper .container {flex-flow: nowrap; align-items: stretch;}
	#main-wrapper .btm-banner-wrapper .container-wrapper .container a .box div.icon { 
		margin:0 auto 15px;
		width:220px; 
		height:220px;
	}
	html[lang="en"]	#main-wrapper .btm-banner-wrapper .container-wrapper .container a .box div.icon {
		width:250px; 
		height:250px;
	}
}


