html {
   min-width: 1000px;
   /* viewport */
}
/*=============================================
 * body
 *=============================================*/
body {
   color: #FFF;
   font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "メイリオ", Meiryo, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
   font-size: 15px;
   line-height: 35px;
   letter-spacing: 0.1em;
   background: #FFF;
   min-width: inherit;
   max-height: 100%;
   font-weight: bold;
}
/*=============================================
 * fonts - DON'T EDIT
 *=============================================*/
.fnt-mincho {
   font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "メイリオ", Meiryo, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.fnt-meiryo {
   font-family: "メイリオ", Meiryo, "ヒラギノ角ゴシックPro", "ＭＳ ゴシック", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.fnt-gothic {
   font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
/*=============================================
 * #wrapper
 *=============================================*/
#wrapper {
   clear: both;
   width: 100%;
   position: relative;
   overflow: hidden;
}
.wrap {
   width: 1000px;
}
/*=============================================
 * header
 *=============================================*/
#header h1 {
   font-size: 12px;
   padding-top: 16px;
   color: #000;
   text-align: right;
}
#header .nav {
   text-align: center;
   margin-bottom: 33px;
   position: absolute;
   padding-top: 10px;
   left: 0;
   right: 0;
   top: 69px;
}
#header .nav li {
   padding: 0 14px;
   float: none;
   display: inline-block;
   position: relative;
}
#header .nav li.active:before,
#header .nav li:hover:before {
   content: "";
   position: absolute;
   background: url(../img/shared/navactive.png) no-repeat;
   width: 4px;
   height: 33px;
   bottom: -33px;
   left: 50%;
   -webkit-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   transform: translateX(-50%);
}
#header .nav li img {
   opacity: 1;
}
#header .nav.active {
   position: fixed;
   left: 0;
   right: 0;
   top: 0;
   height: 79px;
   background: #fff;
   z-index: 100;
}
#header .head {
   min-height: 148px;
   z-index: 100;
}
#header .content {
   padding: 78px 0 63px;
}
#header .content .logo {
   float: left;
   margin-left: 57px;
}
#header .content .tel {
   float: right;
   clear: right;
}
#header .content .t1 {
   padding-top: 61px;
}
#header .content .tel+.tel {
   margin-top: 34px;
   position: relative;
}
#header .content .tel+.tel:before {
   content: "";
   position: absolute;
   background: #000;
   left: 0;
   right: 0;
   height: 1px;
   top: -17px;
}
#header .top {
   position: relative;
}
#header .top .slider {
   width: 100%;
   height: 804px;
   position: relative;
}
#header .top .slide1 {
   background: url(../img/shared/keyjs.jpg) no-repeat center top / cover;
}
#header .top .box {
   position: absolute;
   width: 1000px;
   min-height: 552px;
   left: 50%;
   -webkit-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   transform: translateX(-50%);
   z-index: 56;
   top: 134px;
   background: rgba(255, 255, 255, 0.71);
}
#header .top h2 {
   float: right;
   margin: 9px 85px 0 0;
}
#header .top .txt_v {
   float: right;
   margin: 58px 66px 0 0;
   line-height: 40px;
   height: 430px;
   color: #000;
}
#header .top .tit {
   float: right;
   margin: 276px 47px 0 0;
}
#header.child h1 {
   position: absolute;
   left: 0;
   right: 0;
   bottom: -10px;
   text-align: center;
}
#header.child .content {
   padding: 37px 0 33px;
}
#header.child .content .t1 {
   padding-top: 15px;
}
#header.child .head {
   min-height: 79px;
   position: relative;
}
#header.child .nav {
   top: 0;
}
/* -- -- */
#header .nav {
   text-align: left;
   left: 12px;
}
#header .nav li {
   padding: 0 11px;
}
#header .nav li:last-child {
   position: absolute;
   top: 2px;
   right: -2px;
}
#header .nav li:last-child:before {
   display: none;
}
#header .nav.active {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
}
#header .nav.active li:last-child {
   position: static;
}
#header .nav.active li.active:before, #header .nav.active li:hover:before {
   bottom: 0;
}
.btn_fixed_right {
   position: fixed;
   top: 50%;
   right: 0;
   transform: translateY(-50%);
   z-index: 90;
}
/*=============================================
 * key
 *=============================================*/
#keychild {
   min-height: 723px;
   position: relative;
}
#keychild:before {
   content: "";
   position: absolute;
   background: url(../img/shared/linetop.png) repeat-x;
   height: 30px;
   left: 0;
   right: 0;
}
#keychild:after {
   content: "";
   position: absolute;
   background: #000;
   left: 0;
   right: 0;
   height: 10px;
   bottom: 0;
}
#keychild .arrow {
   position: absolute;
   top: 0;
   left: 50%;
   -webkit-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   transform: translateX(-50%);
}
#key {
   min-height: 900px;
   position: relative;
}
#key:before {
   content: "";
   position: absolute;
   background: url(../img/shared/arrowtop.png) no-repeat;
   width: 79px;
   height: 30px;
   bottom: -30px;
   left: 50%;
   -webkit-transform: translateX(-50%);
   -ms-transform: translateX(-50%);
   transform: translateX(-50%);
   z-index: 1;
}
#key:after {
   content: "";
   position: absolute;
   left: 0;
   right: 0;
   height: 30px;
   bottom: -30px;
   background: url(../img/shared/linetop.png) repeat-x;
}
#key .left {
   position: absolute;
   top: 0;
   left: 0;
   bottom: 0;
   width: calc(50% + 500px);
   background: url(../img/shared/keyleft.png) no-repeat right center / cover;
   opacity: 0;
   -webkit-transition: all 1s ease;
   -o-transition: all 1s ease;
   transition: all 1s ease;
}
#key .right {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   width: calc(50%);
   background: url(../img/shared/keyright.png) no-repeat left center / cover;
   z-index: 1;
   opacity: 0;
   -webkit-transition: all 1s ease 1s;
   -o-transition: all 1s ease 1s;
   transition: all 1s ease 1s;
}
#key .wrap {
   z-index: 2;
   text-align: center;
   padding-top: 120px;
   opacity: 0;
   -webkit-transition: all 1s ease 2s;
   -o-transition: all 1s ease 2s;
   transition: all 1s ease 2s;
}
#key.animated .left,
#key.animated .right,
#key.animated .wrap {
   opacity: 1;
}
#key .logo {
   margin-bottom: 19px;
}
/*=============================================
 * container
 *=============================================*/
#container .g {
   display: table;
   position: relative;
   width: 100%;
}
/*=============================================
 * #socialbuttons
 *=============================================*/
#socialbuttons {
   margin: 0 0 28px;
   padding: 0;
   clear: both;
   display: flex;
   justify-content: center;  
}



/*=============================================
 * footer
 *=============================================*/
#footer {
   color: #000;
}
#footer .head {
   position: relative;
}
#footer .head:after {
   content: "";
   height: 10px;
   display: table;
   background: #000;
   width: 100%;
   margin-bottom: 12px;
}
#footer .head .wrap {
   padding: 55px 0 25px;
}
#footer .head .logo {
   float: left;
   margin-top: 61px;
   margin-left: 88px;
}
#footer .head .info {
   float: right;
   width: 680px;
   font-size: 14px;
   line-height: 30px;
}
#footer .head .info strong {
   font-weight: bold;
}
#footer .head .info p+p {
   margin-top: 15px;
}
#footer .head .pl1 {
   padding-left: 79px;
}
/*#footer .head .pl2 {
  padding-left: 25px;
}*/
#footer .head .pl3 {
   padding-left: 93px;
}
#footer .foot {
   text-align: center;
   position: relative;
   padding-bottom: 32px;
}
#footer .foot:before {
   content: "";
   height: 10px;
   display: table;
   background: #000;
   width: 100%;
   margin-bottom: 22px;
}
#footer .foot .nav {
   margin-bottom: 25px;
}
/*=============================================
 * copyright
 *=============================================*/
address {
   font-size: 13px;
   line-height: 13px;
}

address a{
 font-size: 10px;
 text-align: center;
 color: #FFF;
 display: block;
 text-decoration: none;
}

/*=============================================
 * control slider
 *=============================================*/
.bx-wrapper .bx-pager {
   position: absolute;
   z-index: 50;
   left: 50%;
   padding-top: 11px;
   -webkit-transform: translate(-50%);
   -ms-transform: translate(-50%);
   transform: translate(-50%);
   text-align: center;
   font-size: .85em;
   font-family: Arial;
   font-weight: bold;
   color: #666;
   opacity: 1;
   filter: alpha(opacity=1);
   -ms-filter: "alpha(opacity=1)";
}
.bx-wrapper .bx-pager.bx-default-pager a {
   background: #bcbc75;
   text-indent: -9999px;
   display: block;
   width: 8px;
   height: 8px;
   margin: 0 4px;
   -moz-border-radius: 7px;
   -webkit-border-radius: 7px;
   border-radius: 7px;
}
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:hover {
   background: #ca1515;
}
.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
   display: inline-block;
   *zoom: 1;
   *display: inline;
}
.bx-wrapper .bx-controls-direction {
   position: absolute;
   top: 50%;
   left: 50%;
   z-index: 100;
   width: 100%;
   -webkit-transform: translate(-50%, -50%);
   -ms-transform: translate(-50%, -50%);
   transform: translate(-50%, -50%);
}
.bx-wrapper .bx-controls-direction a {
   width: 29px;
   height: 69px;
   text-indent: -9999px;
   overflow: hidden;
}
.bx-wrapper .bx-controls-direction .bx-prev {
   float: left;
   margin-left: 0;
}
.bx-wrapper .bx-controls-direction .bx-next {
   float: right;
   margin-right: 0;
}
/*=============================================
 * Other
 *=============================================*/
.slider .bx-wrapper,
.slider .bx-viewport {
   min-height: inherit;
   height: inherit !important;
}
.slider .bxSlider {
   height: inherit;
}
.slider .bxSlider li {
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   position: absolute;
}
.row {
   margin: 0 -15px;
}
.row [class*="col-"] {
   padding: 0 15px;
   float: left;
   min-height: 1px;
}
.row .col-6 {
   width: 50%;
}
.row .col-4 {
   width: 33.3333%;
}
.row .col-3 {
   width: 25%;
}
.row .col-2 {
   width: 20%;
}
.row .col-f {
   width: 100%;
}
.tac {
   text-align: center;
}
.fl {
   float: left;
}
.fr {
   float: right;
}
.fn {
   float: none;
}
.cb {
   clear: both;
}
.cl {
   clear: left;
}
.cr {
   clear: right;
}
*,
*:before,
*:after {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
}
.list dl {
   text-align: left;
   display: table;
   width: 100%;
}
.list dl dt {
   float: left;
}
.list dl dd {
   float: right;
}
.shadown {
   -webkit-box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.3);
   -moz-box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.3);
   box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.3);
}
.txt_v {
   -webkit-writing-mode: vertical-rl;
   -moz-writing-mode: vertical-rl;
   -ms-writing-mode: tb-rl;
   writing-mode: vertical-rl;
   text-orientation: upright;
}
.txt_c {
   text-align: center;
}

.fix_box{
	width: 28px;
	display: flex;
	position: fixed;
	top:150px;
	right:-1px;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	z-index: 9999999999999;
}
.fix_box p a{
	font-size: 20px;
	display: block;
	background: url(../img/shared/pattern2.jpg) repeat center top;
	padding: 30px 15px;
	color: #fff;
	letter-spacing: 2px;
	text-decoration: none;
	font-weight: bold;
	text-align: center;
	border:solid 1px #FFF;
}