@charset "utf-8"; 

@media screen and (min-width: 640px) {}
.imgChange{}

@font-face {
font-family: DIN;
src: url(../font/ufonts.com_dinmittelschriftstd-1-opentype.woff);
}

/* scroll */
.animated{ opacity: 0;}

@media screen and (max-width: 480px) {
/*=============================================================
 contents
=============================================================*/
#wrapper{ width: 100%; margin: 0px auto; overflow: hidden;}

/* middle promo */
body#middle #promo{ padding: 15px 0 30px; position: relative; width: 100%;}
h2.middlePromo{ width: 100%; margin: 0px auto; font-size: 2.5em; line-height: 1.1; text-align: center; font-family: DIN; color: #FFF;}
h2.middlePromo span{ display: block; font-size: 1.3rem; line-height: 1.1; text-align: center; font-family: "ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro," メイリオ", Meiryo, Osaka," ＭＳ Ｐゴシック", MS PGothic," sans-serif";}
h2.middlePromo span em{ font-style: normal; display: inline-block; padding: 0 3.0em; position: relative;}
h2.middlePromo span em:before{ content: ""; width: 2.0em; height: 1px; background: rgba(255,255,255,0.3); position: absolute; top: 50%; left: 0px;}
h2.middlePromo span em:after{ content: ""; width: 2.0em; height: 1px; background: rgba(255,255,255,0.3); position: absolute; top: 50%; right: 0px;}

/* color */
body.basic #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #E9A52C; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.basic #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #EA5A1D; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}

/* breadcrumb */
.breadcrumb{ width: 100%; margin: 0 auto 10px; padding: 0.5em 5%; border-bottom: solid 1px #EEE;}
.breadcrumb ul{ letter-spacing: -0.4em;}
.breadcrumb ul li{ display: inline-block; vertical-align: top; letter-spacing: 0; font-size: 1.1rem; line-height: 1.1; padding-left: 1.25em; position: relative; margin-right: 1.0em; color: #999;}
.breadcrumb ul li:before{ content: "\f105"; font-family: FontAwesome; color: #EA5A1D; position: absolute; top: 50%; left: 0px; transform: translateY(-50%);}
.breadcrumb ul li:first-child:before{ content: "\f015";}
.breadcrumb ul li a{ color: #333; text-decoration: none;}
.breadcrumb ul li a:hover{ color: #999;}

/* heading */
h3.heading{ text-align: center; position: relative; margin-bottom: 1.0em; padding-bottom: 0.5em;}
h3.heading span{ display: inline-block; font-size: 2.5rem; line-height: 1.1; color: #EA5A1D;}
h3.heading:before{ content: ""; width: 1.5em; height: 1px; background: #EA5A1D; position: absolute; bottom: 0px; left: 50%; transform: translateX(-50%);}

h3.midashi{ font-size: 1.9rem; line-height: 1.1; font-weight: 600; padding: 0.5em 0;}
h4.midashi{ background: url(../../image/common/h4.png) repeat center top; border: solid 1px rgba(0,0,0,0.05); border-left: solid 2px #EA5B1E; padding: 0.5em; font-size: 1.7rem; line-height: 1.1; margin: 30px 0 15px;}
h5.midashi{ font-size: 1.5rem; line-height: 1.1; font-weight: 600; margin: 15px 0 15px; color: #EA5B1E; padding: 0.5em 0; border-bottom: dotted 1px #E4E4E4;}

/* link button */
.linkBtn{ text-align: center; margin-top: 1.5em;}
.linkBtn a{ display: inline-block; background: #333; border: solid 1px #333; font-weight: 600; color: #FFF; text-decoration: none; padding: 0.25em 3.0em; border-radius: 50px; position: relative;}
.linkBtn a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.linkBtn a:hover:after{ right: 0.75em;}
.linkBtn a:hover{ background: #FFF; color: #333;}

/* image resize */
.imgFit img{ width: 100%; height: auto;}

/* section width */
.full{ width: 90% !important; margin: 0px auto;}
.full .divInr{ width: 100%; margin: 0px auto;}

/* HOME
-------------------------------------------------------------*/
.bx-viewport{ height: 170px !important;}

.bxslider{}
.bxslider li{height: 170px; padding: 0; position: relative;}
.bxslider li:before{ content: ""; width: 100%; height: 100%; background: rgba(255,255,255,0.7); position: absolute; top: 0px; left: 0px; z-index: 0; }
.bxslider li h2{ width: 80%; position: absolute; top: 58%; left: 50%; transform: translate(-50%,-50%); z-index: 10;}
.bxslider li.slide01{ background: url(../../image/slider/slide_bg_01.png) no-repeat center center; background-size: 100%;}
.bxslider li.slide02{ background: url(../../image/slider/slide_bg_02.png) no-repeat center center; background-size: 100%;}
.bxslider li.slide03{ background: url(../../image/slider/slide_bg_03.png) no-repeat center center; background-size: 100%;}
.bxslider li.slide04{ padding: 0px; text-align: center;}
.bxslider li.slide04 h2{ top: 50%;}

body.home #container{ padding-bottom: 0px !important;}

/* menu */
.smartMenu{ width: 100% !important; background: #FFF; padding: 0px !important;}
#panel{ width: 100%; margin: 0px auto;}
#panel dt{ background: #DA551C; cursor: pointer; font-weight: 600; color: #FFF; padding: 1.0em; position: relative; border-bottom: solid 1px rgba(255,255,255,0.1);}
#panel dt:before{ content: "\f055"; font-family: FontAwesome; position: absolute; top: 1.0em; right: 1.0em;}
#panel dd{}
#panel dd ul{ letter-spacing: -0.4em; border: solid 2px #FFF; border-style: solid none none solid;}
#panel dd ul li{ width: 25%; display: inline-block; vertical-align: top; letter-spacing: 0; border: solid 2px #FFF; border-style: none solid solid none;}
#panel dd ul li a{ display: block; padding: 1.0em 0; text-decoration: none; color: rgba(51,51,51,0.8);}
#panel dd ul li span.icon{ display: block; width: 50%; margin: 0px auto;}
#panel dd ul li span.icon img{ width: 100%; height: auto;}
#panel dd ul li em{ display: block; font-style: normal; font-weight: 600; font-size: 1.1rem; line-height: 1.1; text-align: center; margin-top: 0.5em;}
#panel dd ul li:nth-child(1){ background: #FEECCC;}
#panel dd ul li:nth-child(2){ background: #FFFDCC;}
#panel dd ul li:nth-child(3){ background: #ECF4CC;}
#panel dd ul li:nth-child(4){ background: #CCEAD3;}
#panel dd ul li:nth-child(5){ background: #CCECEC;}
#panel dd ul li:nth-child(6){ background: #CCEDFA;}
#panel dd ul li:nth-child(7){ background: #CCE3F0;}
#panel dd ul li:nth-child(8){ background: #CCCEE4;}
#panel dd ul li:nth-child(9){ background: #ECCCE5;}
#panel dd ul li:nth-child(10){ background: #FCCCE6;}
#panel dd ul li:nth-child(11){ background: #FCCCDE;}
#panel dd ul li:nth-child(12){ background: #FCCCCC;}

/* menu2 */
.empmenu{ width: 100% !important; background: #FFF; padding: 0px !important;}
#panel2{ width: 100%; margin: 0px auto;}
#panel2 dt{ background: #DA551C; cursor: pointer; font-weight: 600; color: #FFF; padding: 1.0em; position: relative; border-bottom: solid 1px rgba(255,255,255,0.1);}
#panel2 dt:before{ content: "\f055"; font-family: FontAwesome; position: absolute; top: 1.0em; right: 1.0em;}
#panel2 dd{}
#panel2 dd ul{ letter-spacing: -0.4em; border: solid 2px #FFF; border-style: solid none none solid;}
#panel2 dd ul li{ width: 25%; display: inline-block; vertical-align: top; letter-spacing: 0; border: solid 2px #FFF; border-style: none solid solid none;}
#panel2 dd ul li a{ display: block; padding: 1.0em 0; text-decoration: none; color: rgba(51,51,51,0.8);}
#panel2 dd ul li span.icon{ display: block; width: 50%; margin: 0px auto;}
#panel2 dd ul li span.icon img{ width: 100%; height: auto;}
#panel2 dd ul li em{ display: block; font-style: normal; font-weight: 600; font-size: 1.1rem; line-height: 1.1; text-align: center; margin-top: 0.5em;}
#panel2 dd ul li:nth-child(1){ background: #eaf4fc;}
#panel2 dd ul li:nth-child(2){ background: #eaedf7;}
#panel2 dd ul li:nth-child(3){ background: #e8ecef;}
#panel2 dd ul li:nth-child(4){ background: #ebf6f7;}
#panel2 dd ul li:nth-child(5){ background: #c1e4e9;}
#panel2 dd ul li:nth-child(6){ background: #bce2e8;}
#panel2 dd ul li:nth-child(7){ background: #a2d7dd;}
#panel2 dd ul li:nth-child(8){ background: #abced8;}
#panel2 dd ul li:nth-child(9){ background: #e0ffff;}
#panel2 dd ul li:nth-child(10){ background: #eaf4fc;}
#panel2 dd ul li:nth-child(11){ background: #eaedf7;}
#panel2 dd ul li:nth-child(12){ background: #e8ecef;}

.midashi {
position: relative;
font-size: 20px;
border-bottom: 2px solid #000;
margin: 0.5em;
}

.after {
font-size: 8px;
content: "A" ;
white-space: pre;
}


/* 新着情報 */
.newsList{ padding: 0 0 50px !important; position: relative;}
.newsList:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100px; margin: -25px -10% 0; background: #E9A52C; transform-origin: left top; transform: rotate(3deg); z-index: -1;}
.newsList:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100px; margin: -25px -10% 0; background: #EA5A1D; transform-origin: right top; transform: rotate(-3deg); z-index: -1;}
.newsList h3{ font-size: 2.5rem; line-height: 1.1; text-align: center; font-weight: 600; color: #FFF; padding: 1.0em 0;}
.newsList h3 span{ display: block; font-family: DIN; font-size: 1.5rem; line-height: 1.1; font-weight: normal; text-align: center; opacity: 0.5;}
.newsList table{ width: 100%; margin: 0px auto;}
.newsList table tr{ border-bottom: dashed 2px #DDD;}
.newsList table th{ width: 100%; color: #EA591D; padding: 1.0em 0.5em; position: relative; display: block;}
.newsList table th span{ display: inline-block; width: 30%; text-align: center; font-size: 1.1rem; line-height: 1.1; border: solid 1px #DDD; color: #999; padding: 0.2em 1.0em; position: absolute; top: 50%; left: 30%; transform: translateY(-50%);}
.newsList table td{ width: 100%; padding: 0  0.5em 1.0em 0.5em; display: block;}
.newsList table td a{ color: rgba(51,51,51,1.0); text-decoration: none;}
.newsList table td a:hover{ color: rgba(51,51,51,0.6);}


.homemovie{ background: url(../../image/home/bg_04.png) ; background-size: 100%;  width: 100% !important;}
.homemovie h3{ text-align: center; width: 100%; margin: 0px auto 1.5em auto;}
.homemovie h3 img{ width: 100%; height: auto;}
.homemovie .text{ width: 90%; margin: 0px auto;}
.homemovie ul{ text-align: center; letter-spacing: -0.4em; width: 95%; margin: 2.0em auto 0px auto;}
.homemovie ul li{ width: 100%; display: inline-block; vertical-align: middle; letter-spacing: 0; margin-right: 2%; margin-bottom: 2%; border-radius: 5px; overflow: hidden; background: #FFF; box-shadow: 0px 0px 6px rgba(0,0,0,0.1);}
.homemovie ul li video{ width: 100%; height: auto;}
.homemovie .homeBtn{ text-align: center; margin-top: 2.0em;}
.homemovie .homeBtn a{ display: inline-block; border: solid 2px #EA5A1D; font-size: 1.4rem; line-height: 1.1; font-weight: 600; color: #EA5A1D; text-decoration: none; padding: 0.75em 4.0em; position: relative; border-radius: 50px;}
.homemovie .homeBtn a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.homemovie .homeBtn a:hover:after{ right: 0.75em;}
.homemovie .homeBtn a:hover{ background: #EA5A1D; color: #FFF; border-color: #EE7B4A;}


/* ABOUT INSTANCE */
.homeAbout{ background: url(../../image/home/bg_01.png) no-repeat center center #F6F6F6; background-size: 100%;  width: 100% !important;}
.homeAbout h3{ text-align: center; width: 100%; margin: 0px auto 1.5em auto;}
.homeAbout h3 img{ width: 100%; height: auto;}
.homeAbout .text{ width: 90%; margin: 0px auto;}
.homeAbout ul{ text-align: center; letter-spacing: -0.4em; width: 90%; margin: 2.0em auto 0px auto;}
.homeAbout ul li{ width: 32%; display: inline-block; vertical-align: middle; letter-spacing: 0; margin-right: 2%; border-radius: 300px; overflow: hidden; background: #FFF; box-shadow: 0px 0px 6px rgba(0,0,0,0.1);}
.homeAbout ul li img{ width: 100%; height: auto;}
.homeAbout ul li:nth-child(3n){ margin-right: 0px;}
.homeAbout ul li:nth-child(2){ animation-delay:0.3s;}
.homeAbout ul li:nth-child(3){ animation-delay:0.6s;}
.homeAbout ul li:nth-child(4){ animation-delay:0.9s;}
.homeAbout ul li:nth-child(5){ animation-delay:1.2s;}
.homeAbout ul li:nth-child(5){ margin-right: 0px;}
.homeAbout .homeBtn{ text-align: center; margin-top: 2.0em;}
.homeAbout .homeBtn a{ display: inline-block; border: solid 2px #EA5A1D; font-size: 1.3rem; line-height: 1.1; font-weight: 600; color: #EA5A1D; text-decoration: none; padding: 0.5em 4.0em; position: relative; border-radius: 50px;}
.homeAbout .homeBtn a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.homeAbout .homeBtn a:hover:after{ right: 0.75em;}
.homeAbout .homeBtn a:hover{ background: #EA5A1D; color: #FFF; border-color: #EE7B4A;}

/* STAFF VOICE */
.homeVoice{ background-size: 100%; position: relative; width: 100% !important;}
.homeVoice:before{ content: ""; width: 100%; height: 100%; background: rgba(0,0,0,1.0); position: absolute; top: 0px; left: 0px; z-index: 0;}
.homeVoice h3{ text-align: center; position: relative; z-index: 10; width: 80%; margin: 0px auto 1.5em auto;}
.homeVoice h3 img{ width: 100%; height: auto;}
.homeVoice .text{ color: #FFF; position: relative; z-index: 10;}
.homeVoice .clm{ width: 90%; margin: 2.0em auto 0px auto; position: relative; z-index: 10; letter-spacing: -0.4em;}
.homeVoice .clm .inner{ width: 100%; display: inline-block; vertical-align: top; letter-spacing: 0; position: relative; margin-bottom: 1.0em;}
.homeVoice .clm .inner:nth-child(3){ margin-bottom: 0px;}
.homeVoice .clm .inner:nth-child(2){ animation-delay:0.3s;}
.homeVoice .clm .inner:nth-child(3){ animation-delay:0.6s;}
.homeVoice .clm .inner .image{ width: 100%; position: relative;}
.homeVoice .clm .inner .image img{ width: 100%; height: auto;}
.homeVoice .clm .inner .image span{ width: 22%; height: 70px; border: solid 2px #333; position: absolute; top: 1.0em; right: 1.0em; z-index: 10; padding: 0.5em; text-align: right; font-family: DIN; font-size: 1.0rem; line-height: 1.2;}
.homeVoice .clm .inner .image span strong{ display: block; text-align: right; font-weight: normal; font-size: 2.5rem; line-height: 1.1;}
.homeVoice .clm .inner .box{ width: 100%; background: rgba(255,255,255,0.9); padding: 1.5em 1.0em;}
.homeVoice .clm .inner .box h4{ border-bottom: solid 1px rgba(0,0,0,0.05); margin-bottom: 0.75em; padding-bottom: 0.75em;}
.homeVoice .clm .inner .box h4 span{ display: block; font-size: 1.1rem; line-height: 1.1; margin-bottom: 0.25em;}
.homeVoice .clm .inner .box h4 strong{ display: block; font-size: 2.9rem; line-height: 1.1; font-weight: 600;}
.homeVoice .clm .inner .box h4 strong:first-letter{ color: #EA591D;}
.homeVoice .clm .inner .box .text{ font-size: 1.3rem; line-height: 1.2; color: #333;}
.homeVoice .clm .inner .box .button{ margin-top: 1.0em;}
.homeVoice .clm .inner .box .button a{ display: inline-block; font-size: 1.1rem; line-height: 1.1; color: #FFF; text-decoration: none; font-weight: 600; padding: 0.25em 2.0em; border: solid 1px #333; background: #333; border-radius: 50px; position: relative;}
.homeVoice .clm .inner .box .button a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.homeVoice .clm .inner .box .button a:hover:after{ right: 0.75em;}
.homeVoice .clm .inner .box .button a:hover{ background: none; color: #333;}
.homeVoice .homeBtn{ text-align: center; margin-top: 2.0em;}
.homeVoice .homeBtn a{ display: inline-block; border: solid 2px #FFF; font-size: 1.4rem; line-height: 1.1; font-weight: 600; color: #FFF; text-decoration: none; padding: 0.75em 4.0em; position: relative; border-radius: 50px;}
.homeVoice .homeBtn a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.homeVoice .homeBtn a:hover:after{ right: 0.75em;}
.homeVoice .homeBtn a:hover{ background: #FFF; color: #333; border-color: rgba(51,51,51,0.3);}

/* INHOUSE SYSTEM */
.homeService{ background: url(../../image/home/bg_03.png) no-repeat center center; background-size: 130%; position: relative; overflow: hidden; width: 100% !important;}
.homeService h3{ text-align: center; position: relative; z-index: 10; width: 80%; margin: 0px auto 1.5em auto;}
.homeService h3 img{ width: 100%; height: auto;}
.homeService .text{ color: #FFF; position: relative; z-index: 10;}
.homeService ul{ text-align: center; width: 90%; margin: 1.0em auto 0px auto; letter-spacing: -0.4em; position: relative; z-index: 10;}
.homeService ul li{ width: 30.666666%; display: inline-block; vertical-align: top; letter-spacing: 0; margin-right: 4%; box-shadow: 0px 0px 6px rgba(0,0,0,0.1); background: #FFF; border-radius: 300px; overflow: hidden;}
.homeService ul li:nth-child(3n){ margin-right: 0px;}
.homeService ul li:nth-child(2){ animation-delay:0.3s;}
.homeService ul li:nth-child(3){ animation-delay:0.6s;}
.homeService ul li img{ width: 100%; height: auto;}
.homeService ul li a{ opacity: 1.0;}
.homeService ul li a:hover{ opacity: 0.6;}

/*  */
.homeCont{ background: url(../../image/home/graph.png) repeat center top; width: 100% !important;}
.homeCont h3{ text-align: center; position: relative; z-index: 10; width: 80%; margin: 0px auto 1.5em auto;}
.homeCont h3 img{ width: 100%; height: auto;}
.homeCont .text{ position: relative; z-index: 10; width: 90%; margin: 0px auto;}
.homeCont .homeBtn{ text-align: center; margin-top: 2.0em;}
.homeCont .homeBtn a{ display: inline-block; border: solid 2px #EA5A1D; font-size: 1.3rem; line-height: 1.1; font-weight: 600; color: #EA5A1D; text-decoration: none; padding: 0.75em 5.0em; position: relative; border-radius: 50px;}
.homeCont .homeBtn a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.homeCont .homeBtn a:hover:after{ right: 0.75em;}
.homeCont .homeBtn a:hover{ background: #EA5A1D; color: #FFF; border-color: #EE7B4A;}

.homeCont .phone{ width: 70%; margin: 1.0em auto 0px;}
.homeCont .phone img{ width: 100%; height: auto;}
.homeCont .phone a{ padding-left: 0px;}
.homeCont .phone a:before{ content: "";}

/*  */
.homeMap{ padding: 0px !important; width: 100% !important;}
.homeMap iframe{ width: 100%; vertical-align: top;}

/* TOPICS
-------------------------------------------------------------*/
.topicsList{}
.topicsList li{ letter-spacing: -0.4em; padding: 1.5em 0; border-bottom: solid 1px #EEE;}
.topicsList li span{ width: 12%; display: inline-block; vertical-align: top; letter-spacing: 0; color: #999;}
.topicsList li em{ font-style: normal; width: 10%; display: inline-block; vertical-align: middle; letter-spacing: 0; font-size: 1.1rem; line-height: 1.1; text-align: center; border: solid 1px #DDD; color: #999; padding: 0.2em 0;}
.topicsList li a{ width: 74%; display: inline-block; vertical-align: top; letter-spacing: 0; color: rgba(51,51,51,1.0); text-decoration: none; margin-left: 4%; position: relative;}
.topicsList li a:before{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.5em; transform: translateY(-50%); transition: all 0.2s ease 0s; color: #999;}
.topicsList li a:hover:before{ right: 1.0em; color: #EA5B1E;}
.topicsList li a:hover{ color: rgba(51,51,51,0.6);}

.pager{ text-align: center; letter-spacing: -0.4em;}
.pager li{ display: inline-block; vertical-align: top; letter-spacing: 0; line-height: 1.0; width: 3%; border: solid 1px #E4E4E4; margin: 0 2px; border-radius: 3px;}
.pager li a{ color: rgba(51,51,51,1.0); text-decoration: none; display: block; padding: 0.75em 0;}
.pager li.active a,
.pager li a:hover{ background: #666; color: #FFF;}

.update{ letter-spacing: -0.4em; border-top: solid 1px #EEE; margin-bottom: 1.0em;}
.update li{ display: inline-block; vertical-align: middle; letter-spacing: 0; font-size: 1.1rem; line-height: 1.1; padding: 0.5em 0;}
.update li.date{ margin-right: 1.0em;}
.update li.cate span{ display: inline-block; background: #EA5B1E; color: #FFF; padding: 0.25em 1.5em; border-radius: 5px;}

/* ABOUT US
-------------------------------------------------------------*/
/* color */
body.about #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #F55797; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.about #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #F22D7D; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}
body.about h3.heading span,
body.about .breadcrumb ul li:before{ color: #F22D7D;}
body.about h3.heading:before,
body.about footer{ background: #F22D7D;}
body.about footer .footNavi li a:hover{ background: #FFF; color: #F22D7D; border-color: rgba(242,45,125,0.3);}

/* インスタンスは4つのキーワードを企業ポリシーとして行動しています */
.idea01{ position: relative; width: 100%; margin: 0px auto; padding: 0 0 3.0em 0;}
.idea01 h4{ width: 70%; margin: 0px auto 0.5em;}
.idea01 h4 img{ width: 100%; height: auto;}
.idea01 .inner{ width: 100%;}
.idea01 .inner p{ color: #2695B9; font-weight: 600; text-align: center;}
.idea01:before{ content: ""; width: 40px; height: 40px; background: url(../../image/about/cross.png); background-size: contain; position: absolute; bottom: -20px; left: 50%; transform: translateX(-50%);}

.idea02{ position: relative; width: 100%; margin: 0px auto; padding: 3.0em 0;}
.idea02 h4{ width: 70%; margin: 0px auto 0.5em;}
.idea02 h4 img{ width: 100%; height: auto;}
.idea02 .inner{ width: 100%;}
.idea02 .inner p{ color: #174D97; font-weight: 600; text-align: center;}
.idea02:before{ content: ""; width: 40px; height: 40px; background: url(../../image/about/cross.png); background-size: contain; position: absolute; bottom: -20px; left: 50%; transform: translateX(-50%);}

.idea03{ position: relative; width: 100%; margin: 0px auto; padding: 3.0em 0;}
.idea03 h4{ width: 40%; margin: 0px auto 0.5em;}
.idea03 h4 img{ width: 100%; height: auto;}
.idea03 .inner{ width: 100%;}
.idea03 .inner p{ color: #E9A52C; font-weight: 600; text-align: center;}
.idea03:before{ content: ""; width: 40px; height: 40px; background: url(../../image/about/cross.png); background-size: contain; position: absolute; bottom: -20px; left: 50%; transform: translateX(-50%);}

.idea04{ position: relative; width: 100%; margin: 0px auto; padding: 3.0em 0;}
.idea04 h4{ width: 50%; margin: 0px auto 0.5em;}
.idea04 h4 img{ width: 100%; height: auto;}
.idea04 .inner{ width: 100%;}
.idea04 .inner p{ color: #D41A19; font-weight: 600; text-align: center;}

/* インスタンスについて */
.aboutus{ width: 100% !important; background: url(../../image/about/stripe_01.png) repeat center top; padding: 25px 5% !important;}
.aboutClm{ letter-spacing: -0.4em; margin: 0px auto;}
.aboutClm .inner{ width: 100%; display: inline-block; vertical-align: top; letter-spacing: 0; margin: 1.0em 0 1.0em 0; border: solid 4px #FEEAF2; background: #FFF; padding: 1.0em; border-radius: 5px;}
.aboutClm .inner:nth-child(2){ animation-delay:0.3s;}
.aboutClm .inner:nth-child(3){ animation-delay:0.6s;}
.aboutClm .inner:nth-child(4){ animation-delay:0.9s;}
.aboutClm .inner h4{ font-size: 2.1rem; text-align: center; line-height: 1.1; font-weight: 600; color: #F22D7D; border-bottom: solid 1px #FEEAF2; padding: 0.5em 0 0.75em 0; margin-bottom: 0.75em;}

/* 会社概要 */
.companyTable{ width: 100%; border-top: dotted 1px #E4E4E4; margin-top: 2.0em;}
.companyTable tr{ letter-spacing: -0.4em; display: block; padding: 1.0em 0; border-bottom: dotted 1px #E4E4E4;}
.companyTable tr th{ width: 30%; display: inline-block; vertical-align: top; letter-spacing: 0; padding: 0 0.5em; color: #F22D7D;}
.companyTable tr td{ width: 70%; display: inline-block; vertical-align: top; letter-spacing: 0; padding: 0 0.5em; border-left: solid 2px #F22D7D;}

/* 会社沿革 */
.historyTable{ width: 100%; border-top: solid 1px #EEE; margin-top: 2.0em;}
.historyTable tr{ border-bottom: solid 1px #EEE;}
.historyTable tr:nth-child(even){ background: rgba(0,0,0,0.015);}
.historyTable tr th{ width: 25%; padding: 0.5em; background: rgba(0,0,0,0.015);}
.historyTable tr td{ width: 75%;padding: 0.5em;}

/* EXECUTIVE
-------------------------------------------------------------*/
.executive01{ background: url(../../image/about/executive_01.png) no-repeat top left; background-size: 270%; position: relative; padding: 33.0em 0 0 0; width: 100%; margin: 0px auto;}
.executive01 h3{ font-size: 2.1rem; line-height: 1.2; font-weight: 600; color: #F22D7D; margin-bottom: 0.5em;}
.executive01 h4.name{ font-family: "游明朝体", "Yu Mincho", YuMincho, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif; font-size: 2.1rem; line-height: 1.1; margin-top: 0.5em;}
.executive01 h4.name span{ display: inline-block; font-size: 1.3rem; margin-right: 1.0em;}
.executive01 h4.name em{ font-style: normal; display: block; font-size: 1.1rem; line-height: 1.1; margin-top: 0.25em; padding-left: 7.25em;}
.executive01 ul{ margin-top: 1.0em; letter-spacing: -0.4em; text-align: right;}
.executive01 ul li{ font-family: DIN; line-height: 1.1; width: 32%; display: inline-block; vertical-align: top; letter-spacing: 0; margin-right: 2%;}
.executive01 ul li:nth-child(3n){ margin-right: 0px;}
.executive01 ul li a{ display: block; text-decoration: none; color: #FFF; background: #F22D7D; text-align: center; padding: 45px 0; cursor: pointer;}
.executive01 ul li a:hover{ background: #F55797;}

p.d03{ animation-delay:0.3s;}

p.mt-3em,
p.mt-6em{ margin-top: 1.0em !important;}

.executive02{ background: url(../../image/about/executive_02.png) no-repeat top right; background-size: 270%; position: relative; padding: 33.0em 0 0 0;}
.executive02 h3{ font-size: 2.1rem; line-height: 1.2; font-weight: 600; color: #F22D7D; margin-bottom: 0.5em;}
.executive02 h4.name{ font-family: "游明朝体", "Yu Mincho", YuMincho, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif; font-size: 2.1rem; line-height: 1.1; margin-top: 0.5em;}
.executive02 h4.name span{ display: inline-block; font-size: 1.3rem; margin-right: 1.0em;}
.executive02 h4.name em{ font-style: normal; display: block; font-size: 1.1rem; line-height: 1.1; margin-top: 0.25em; padding-left: 7.25em;}
.executive02 ul{ margin-top: 1.0em; letter-spacing: -0.4em; text-align: right;}
.executive02 ul li{ font-family: DIN; line-height: 1.1; width: 32%; display: inline-block; vertical-align: top; letter-spacing: 0; margin-right: 2%;}
.executive02 ul li:nth-child(3n){ margin-right: 0px;}
.executive02 ul li a{ display: block; text-decoration: none; color: #FFF; background: #F22D7D; text-align: center; padding: 45px 0; cursor: pointer;}
.executive02 ul li a:hover{ background: #F55797;}

.modal-content h3{ font-size: 2.5rem; line-height: 1.2; font-weight: 600; color: #F22D7D; margin-bottom: 0.75em; border-bottom: solid 1px #EEE; padding-bottom: 0.75em; text-align: left;}
.modal-content .text{ text-align: left;}

/* SERVICE
-------------------------------------------------------------*/
/* color */
body.service #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #E9A52C; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.service #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #EA5A1D; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}
body.service h3.heading span,
body.service .breadcrumb ul li:before{ color: #EA5A1D;}
body.service h3.heading:before,
body.service footer{ background: #EA5A1D;}

.serviceFigure{ width: 80%; margin: 0px auto;}
.serviceTable{ width: 100%; border: solid 1px #E4E4E4;}
.serviceTable th{ background: rgba(234,90,29,0.7); color: #FFF; border: solid 1px #E4E4E4; border-collapse: collapse; padding: 0.5em; width: 30%; line-height: 1.3;}
.serviceTable td{ background: #FFF; border: solid 1px #E4E4E4; border-collapse: collapse; padding: 0.5em; width: 35%; line-height: 1.3; word-break: break-all;}

/* 派遣事業 */
.serviceClm{ letter-spacing: -0.4em;}
.serviceClm .inner{ width: 100%; display: inline-block; vertical-align: top; letter-spacing: 0;}
.serviceClm ul{ width: 100%; display: inline-block; vertical-align: top; margin-top: 1.5em;}
.serviceClm ul li{ width: 30.666666%; display: inline-block; vertical-align: top; letter-spacing: 0; margin: 0 4% 1.0em 0;}
.serviceClm ul li:nth-child(3n){ margin-right: 0px;}
.serviceClm ul li:nth-child(1){ animation-delay:0.3s;}
.serviceClm ul li:nth-child(2){ animation-delay:0.6s;}
.serviceClm ul li:nth-child(3){ animation-delay:0.9s;}
.serviceClm ul li a{ font-size: 6.0rem; line-height: 1.1; display: block; text-align: center; color: rgba(212,26,25,1);}
.serviceClm ul li a:hover{ color: rgba(212,26,25,0.6);}
.serviceClm ul li span{ display: block; font-size: 1.3rem; line-height: 1.1; margin-top: 0.5em; text-align: center;}

.getPdf{ border: dotted 1px #E4E4E4; background: #F9F9F9; margin-top: 5.0em; letter-spacing: -0.4em; padding: 0.5em;}
.getPdf a{ display: inline-block; width: 30%; vertical-align: middle; letter-spacing: 0;}
.getPdf img{ width: 100%; height: auto;}
.getPdf p{ width: 66%; display: inline-block; vertical-align: middle; letter-spacing: 0; margin-left: 4%; font-size: 1.3rem; line-height: 1.2;}

/* MEMBER
-------------------------------------------------------------*/
/* color */
body.member #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #FAC067; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.member #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #F9B041; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}
body.member h3.heading span,
body.member .breadcrumb ul li:before{ color: #F9B041;}
body.member h3.heading:before,
body.member footer{ background: #F9B041;}
body.member footer .footNavi li a:hover{ background: #FFF; color: #F9B041; border-color: rgba(249,176,65,0.3);}

/* STAFF VOICE */
.voice{ letter-spacing: -0.4em;}
.voice .inner{ width: 49%; display: inline-block; vertical-align: top; letter-spacing: 0; margin: 0 2% 2.0em 0;}
.voice .inner:nth-child(2n){ margin-right: 0px;}
.voice .inner .image{ position: relative; min-height: 190px;}
.voice .inner .image img{ width: 100%; height: auto;}
.voice .inner .image span{ width: 30%; height: 55px; border: solid 2px #333; position: absolute; top: 1.0em; right: 1.0em; z-index: 10; padding: 0.5em; text-align: right; font-family: DIN; font-size: 1.0rem; line-height: 1.2;}
.voice .inner .image span strong{ display: block; text-align: right; font-weight: normal; font-size: 2.5rem; line-height: 1.1;}
.voice .inner h4{ font-size: 1.9rem; line-height: 1.1; font-weight: 600; padding: 1.25em 0.5em 0.5em 0.5em; position: relative; color: #FFF;}
.voice .inner h4 span{ font-size: 1.0rem; line-height: 1.1; position: absolute; top: 1.0em; left: 1.0em;}
.voice .inner a{ color: #333; text-decoration: none; display: block; background: #F9B041;}
.voice .inner a:hover{ background: #000;}

.voice .inner:nth-child(1) .image{ background: url(../../image/member/mem_01_off.png) no-repeat center top; background-size: contain;}
.voice .inner:nth-child(2) .image{ background: url(../../image/member/mem_02_off.png) no-repeat center top; background-size: contain;}
.voice .inner:nth-child(3) .image{ background: url(../../image/member/mem_03_off.png) no-repeat center top; background-size: contain;}
.voice .inner:nth-child(4) .image{ background: url(../../image/member/mem_04_off.png) no-repeat center top; background-size: contain;}
.voice .inner:nth-child(5) .image{ background: url(../../image/member/mem_05_off.png) no-repeat center top; background-size: contain;}
.voice .inner:nth-child(6) .image{ background: url(../../image/member/mem_06_off.png) no-repeat center top; background-size: contain;}

/* ALL STAFF */
.allStaff{ position: relative;}

/* voice */
.voiceHead{ position: relative;}
.voiceHead .image img{ width: 100%; height: auto;}
.voiceHead h3{ display: inline-block; background: rgba(255,255,255,0.9); padding: 0.25em 0.5em; position: absolute; bottom: 50px; right: 0px; z-index: 10; font-size: 2.5rem; line-height: 1.1; color: #F9B041; font-weight: 600;}
.voiceHead h3 span{ display: block; font-size: 1.5rem; line-height: 1.1; margin-bottom: 0.25em;}
.voiceHead h3 em{ display: block; font-size: 1.3rem; line-height: 1.1; font-weight: normal; text-align: right; color: #333; letter-spacing: 0.1em; margin-top: 0.5em; border-top: solid 1px rgba(0,0,0,0.1); padding-top: 0.5em;}

.voiceConts{ position: relative;}
.voiceConts .image{ width: 100%; float: none !important;}
.voiceConts .image img{ width: 100%; height: auto;}
.voiceConts .inner{ width: 100%; background: rgba(255,255,255,0.8); padding: 1.0em 0;}
.voiceConts .inner.left{ left: 0px;}
.voiceConts .inner.right{ right: 0px;}
.voiceConts.profile .inner{ width: 100%; position: relative; transform: translateY(0);}
.voiceConts .inner h4{ font-size: 1.9rem; line-height: 1.1; font-weight: 600; color: #F9B041; padding-bottom: 0.5em; margin-top: 2.0em; margin-bottom: 0.5em; border-bottom: solid 1px rgba(0,0,0,0.05);}
.voiceConts .inner h4:first-child{ margin-top: 0px;}
.voiceConts .inner table { width: 100%; border-top: solid 1px rgba(0,0,0,0.05); margin-top: 2.0em;}
.voiceConts .inner table tr{ border-bottom: solid 1px rgba(0,0,0,0.05);}
.voiceConts .inner table tr th{ padding: 0.75em 0.5em; width: 30%; color: #F9B041;}
.voiceConts .inner table tr td{ padding: 0.75em 0.5em; width: 70%;}

.voiceTxt{ padding: 0px !important; margin-top: -25px !important;}
.voiceTxt p{ padding: 1.0em 0;}

.linkBtns{ letter-spacing: -0.4em; text-align: center;}
.linkBtns li{ width: 100%; display: inline-block; vertical-align: middle; letter-spacing: 0; margin: 0.5em 0;}
.linkBtns li a{ display: block; border: solid 2px #F9B041; color: #F9B041; text-decoration: none; font-weight: 600; font-size: 1.5rem; line-height: 1.1; padding: 1.0em 0; text-align: center; border-radius: 5px; position: relative;}
.linkBtns li a:hover{ background: #F9B041; color: #FFF; border-color: #FAC067;}
.linkBtns li:nth-child(1) a:before{ content: "\f104"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; left: 1.5em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.linkBtns li:nth-child(1) a:hover:before{ left: 0.75em;}
.linkBtns li:nth-child(2) a:before{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.5em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.linkBtns li:nth-child(2) a:hover:before{ right: 0.75em;}


.staffList{ letter-spacing: -0.4em; width: 90% !important; margin: 0px auto;}
.staffList li{ width: 100%; display: inline-block; vertical-align: top; letter-spacing: 0; margin: 0 0 0.5em 0; position: relative; font-size: 2.1rem; line-height: 1.1; font-weight: 600; font-family: DIN; border: solid 3px #F9F9F9; padding: 0.75em; padding-left: 2.5em; border-radius: 5px; box-shadow: 0px 0px 5px rgba(0,0,0,0.1);}
.staffList li:nth-child(2n){ margin-right: 0px;}

/* SYSTEM
-------------------------------------------------------------*/
/* color */
body.system #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #65C967; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.system #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #3EBC41; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}
body.system .breadcrumb{ border-bottom: none;}
body.system h3.heading span,
body.system .breadcrumb ul li:before{ color: #3EBC41;}
body.system h3.heading:before,
body.system footer{ background: #3EBC41;}
body.system footer .footNavi li a:hover{ background: #FFF; color: #3EBC41; border-color: rgba(62,188,65,0.3);}
body.system #container{ border-top: solid 1px #EEE; background: #F9F9F9;}

.listCover{ letter-spacing: -0.4em;}
.listCover li.listItem{ width: 50%; display: inline-block; vertical-align: top; letter-spacing: 0; padding: 0.5em; cursor: pointer;}
.listCover li.listItem h3{ box-shadow: 0px 0px 6px rgba(0,0,0,0); border: solid 2px #EEE; transition: all 0.2s ease 0s; position: relative; background: #FFF; padding: 0.5em;}
.listCover li.listItem h3 span{ font-size: 1.5rem; line-height: 1.1; font-weight: 600; text-align: center; display: block; height: 3.5em;}
.listCover li.listItem h3 em{ display: block; font-size: 1.1rem; font-weight: normal; text-align: center; font-style: normal;}
.listCover li.listItem h3:after{ content: ""; width: 80px; height: 80px; display: block; background: #f6f6f6; margin: 0px auto;}
.listCover .listItem .selfRep{ display: none;}
.listCover .active { background: url(../../image/system/arrow.png) no-repeat bottom center;}
.listCover .listItem.active h3{ color: #3EBC41; border-color: #3EBC41;}
.listCover li.listItem h3:hover{ color: #3EBC41; border-color: #3EBC41; box-shadow: 0px 0px 6px rgba(0,0,0,0.1);}
.listCover h3.heading{ letter-spacing: 0; display: block; margin-top: 3.0em; clear: both;}

.expandField { width: 100%; min-height: 130px; text-align: left; display: block; background: #333; float: left; position: relative; overflow: hidden; border-radius: 5px;}
.expandField .btnClose { top: 0.5em; right: 0.5em; width: 2.0em; height: 2.0em; position: absolute; overflow: hidden; cursor: pointer;}
.expandField .btnClose:before{ content: "\f00d"; font-family: FontAwesome; color: #FFF; font-size: 3.0rem; line-height: 1.1;}
.expandField p { padding: 2.5em; position: relative; letter-spacing: 0; color: #FFF; line-height: 1.3;}

/* ACTIVITY
-------------------------------------------------------------*/

/* color */
body.activity #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #4B90CA; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.activity #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #1E74BD; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}
body.activity h3.heading span,
body.activity .breadcrumb ul li:before{ color: #1E74BD;}
body.activity h3.heading:before,
body.activity footer{ background: #1E74BD;}
body.activity footer .footNavi li a:hover{ background: #FFF; color: #1E74BD; border-color: rgba(30,116,189,0.3);}
body.activity #container{ padding-bottom: 0px !important;}

.activityLead{ background: #fff1c4; background-size: 100% auto; background-position: center top; background-repeat: no-repeat; border-radius: 5px; overflow: hidden;}
.activityLead .inner{ width: 100%; margin:0; padding: 36.0em 5% 1.0em;}
.activityLead .inner h3{ font-size: 2.1rem; line-height: 1.2; margin-bottom: 0.5em; text-align: left;}
.activityLead .inner h3 br{ display: none;}
.activityLead .inner p{ text-align: left;}
.activityLead .inner .box{ background: rgba(255,255,255,0.7); box-shadow: 0px 0px 6px rgba(0,0,0,0.1); padding: 1.0em; margin-top: 1.5em; border-radius: 5px; width: 100%;}
.activityLead .inner .box h4{ font-size: 1.7rem; line-height: 1.1; color: #EA5B1E; padding-bottom: 0.75em; margin-bottom: 0.75em; border-bottom: solid 1px rgba(0,0,0,0.05);}
.activityLead .inner .box p{ font-size: 1.3rem; line-height: 1.5; text-align: left;}

/* 社内／イベント */
.gallery{ letter-spacing: -0.4em;}
.gallery li{ width: 50%; display: inline-block; vertical-align: top; letter-spacing: 0;}
.gallery li img{ width: 100%; height: auto;}
.gallery li:nth-child(1){ animation-delay:0.3s;}
.gallery li:nth-child(2){ animation-delay:0.6s;}
.gallery li:nth-child(3){ animation-delay:0.9s;}
.gallery li:nth-child(4){ animation-delay:1.2s;}
.gallery li:nth-child(5){ animation-delay:1.5s;}
.gallery li:nth-child(6){ animation-delay:1.8s;}
.gallery li:nth-child(7){ animation-delay:2.1s;}
.gallery li:nth-child(8){ animation-delay:2.4s;}

/* インフォグラフィックス */
.graphic{ background-size: 150%; position: relative; width: 100% !important;}
.graphic:before{ content: ""; width: 100%; height: 100%; background: rgba(30,116,189,1.0); position: absolute; top: 0px; left: 0px; z-index: 0;}
.graphic h3.heading span{ color: #FFF !important;}
.graphic h3.heading:before{ background: #FFF !important;}

.infographics{ letter-spacing: -0.4em; width: 90%; margin: 0px auto 1.5em;}
.infographics .inner{ width: 100%; display: inline-block; vertical-align: top; letter-spacing: 0; margin-bottom: 0em;}
.infographics .inner:nth-child(2n){}
.infographics .inner ul{ letter-spacing: -0.4em;}
.infographics .inner ul > li{ display: inline-block; vertical-align: top; letter-spacing: 0; width: 48%; margin-right: 4%; margin-bottom: 1.5em;}
.infographics .inner ul > li:nth-child(2n){ margin-right: 0px;}

.infographics .inner ul > li.info07,
.infographics .inner ul > li.info08,
.infographics .inner ul > li.info09,
.infographics .inner ul > li.info10,
.infographics .inner ul > li.info14,
.infographics .inner ul > li.info15,
.infographics .inner ul > li.info16,
.infographics .inner ul > li.info17{ width: 100%; margin-right: 0px;}
.infographics .inner ul > li.info08,
.infographics .inner ul > li.info15{ margin-bottom: 0px;}

.infographics .box{ background: rgba(255,255,255,0.3); padding: 1.0em; box-shadow: 0px 0px 6px rgba(0,0,0,0.05); position: relative;}
.infographics h4{ font-size: 2.1rem; line-height: 1.1; text-align: center; color: #FFF; font-weight: 600;}

.infographics.clm02 .info06,
.infographics.clm03 .info11{ margin-bottom: 1.5em;}
.info11 ol li span em{ font-size: 2.1rem !important;}
.info12 h5 em{ font-size: 1.5rem !important; width: 70%; text-align: left;}
.info12 h5 strong{ font-size: 3.0rem !important;}
.info13 ol li span strong{ font-size: 3.0rem !important;}

.infographics .middle,
.infographics .small{ min-height: 190px;}
.infographics.clm04 .small{ min-height: 400px;}
.infographics.clm03 .clm{ width: 100%;}
.infographics.clm04 .large{ min-height: 220px;}

/* hack */
.info01 ol{ width: 70%;}
.info04 ol li:nth-child(1){ width: 36%; position: absolute; top: 30%; left: 15%;}
.info04 ol li:nth-child(2){ width: 32%; position: absolute; top: 35%; right: 15%;}
.info04 ol li:nth-child(3){ width: 30%; position: absolute; bottom: 15%; left: 10%;}
.info04 ol li:nth-child(4){ width: 34%; position: absolute; bottom: 10%; right: 10%;}

.info11 ol{ width: 90%; margin: 5.0em auto 0;}
.info11 ol li span{ display: block; width: 58%; position: absolute; top: 50%; transform: translateY(-50%); color: #FFF; font-family: DIN; font-size: 2.1rem;}
.info11 ol li span strong{ font-weight: normal; font-size: 4.0rem; display: inline-block;}

.info12 h5{ width: 90%;}
.info12 h5 strong{ font-size: 3.0rem;}

/* animation */
.d01{ animation-delay: 0.3s;}
.d02{ animation-delay: 0.6s;}
.d03{ animation-delay: 0.9s;}
.d04{ animation-delay: 1.2s;}
.d05{ animation-delay: 1.5s;}
.d06{ animation-delay: 1.8s;}
.d07{ animation-delay: 2.1s;}
.d08{ animation-delay: 2.4s;}
.d09{ animation-delay: 2.7s;}
.d10{ animation-delay: 3.0s;}

/* RECRUIT
-------------------------------------------------------------*/
.recruitIntro{ background: url(../../image/recruit/image_01.png) no-repeat center top; background-size: 110%; padding: 2.5em 0 2.5em; border-radius: 10px;}
.recruitIntro ul{ width: 100%; margin: 0px auto; position: relative; padding-bottom: 13.0em;}
.recruitIntro ul li{ display: inline-block; line-height: 1.1; text-align: center; font-weight: 600; color: #FFF; background: rgba(42,59,141,0.8); border: solid 2px rgba(42,59,141,0.2); padding: 0.75em 2.0em; border-radius: 5px; box-shadow: 0px 0px 6px rgba(0,0,0,0.1);}
.recruitIntro ul li:nth-child(1){ position: absolute; top: -3.0em; left: -1.0em; animation-delay:0.3s;}
.recruitIntro ul li:nth-child(2){ position: absolute; top: 0.5em; right: -1.0em; animation-delay:0.6s;}
.recruitIntro ul li:nth-child(3){ position: absolute; top: 5.0em; left: 0.5em; animation-delay:0.9s;}
.recruitIntro ul li:nth-child(4){ position: absolute; top: 8.0em; right: -0.5em; animation-delay:1.2s;}
.recruitIntro p{ width: 90%; margin: 0px auto; background: rgba(255,255,255,0.8); padding: 0.5em; text-align: center; border: solid 2px rgba(255,255,255,0.3); border-radius: 5px; font-weight: 600; color: #2A3B8D; font-size: 1.1rem; line-height: 1.3; box-shadow: 0px 0px 6px rgba(0,0,0,0.1); animation-delay:1.5s;}

.outlineTable{ width: 100%; border: solid 1px #E4E4E4;}
.outlineTable th{ background: #2A3B8D; vertical-align: middle; color: #FFF; text-align: center; width: 20%; padding: 0.5em; border: solid 1px #E4E4E4;}
.outlineTable td{ padding: 0.5em; border: solid 1px #E4E4E4;}

.model{ letter-spacing: -0.4em;}
.model li{ width: 48%; display: inline-block; vertical-align: top; letter-spacing: 0; margin: 0.5em 2% 0.5em 0; border: solid 2px #EEE; border-radius: 5px; padding: 1.0em;}
.model li:nth-child(2n){ margin-right: 0px;}
.model li h5{ font-size: 1.7rem; line-height: 1.1; text-align: center; font-weight: 600; color: #2A3B8D; padding: 0.25em 0 0.75em; margin-bottom: 0.75em; border-bottom: solid 1px #EEE;}
.model li p{ text-align: center; line-height: 1.3;}

.clmLink{ letter-spacing: -0.4em; margin-top: 2.0em; margin-bottom: 1.5em;}
.clmLink li{ width: 32%; display: inline-block; vertical-align: top; letter-spacing: 0; margin: 0 2% 0.5em 0;}
.clmLink li:nth-child(3n){ margin-right: 0px;}
.clmLink li a{ display: block; border: solid 2px #333; border-radius: 5px; color: #333; font-weight: 600; text-decoration: none; text-align: center; padding: 1.0em 0; position: relative;}
.clmLink li a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 2.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.clmLink li a:hover:after{ right: 1.5em;}
.clmLink li a:hover{ color: #FFF; background: #333; border-color: #999;}

.rectBtn{ background: url(../../image/recruit/image_02.png) no-repeat center center; background-size: 100%; padding: 6.0em 0 1.5em !important; margin-bottom: -25px !important; text-align: center;}
.rectBtn a{ display: inline-block; font-size: 1.3rem; line-height: 1.1; text-decoration: none; font-weight: 600; color: #FFF; background: #EA5B1E; padding: 1.0em 3.0em; border-radius: 5px; border: solid 2px #FFF; position: relative;}
.rectBtn a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 2.0em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
.rectBtn a:hover:after{ right: 1.5em;}
.rectBtn a:hover{ background: #EE7B4A; color: #FFF;}

.recruitmovie{ letter-spacing: -0.4em;}
.recruitmovie li{ width: 100%; display: inline-block; vertical-align: top; letter-spacing: 0; margin: 0.5em 2% 0.5em 0 ; border: solid 2px #EEE; border-radius: 5px; padding: 0.5em;}
.recruitmovie li h5{ font-size: 1.7rem; line-height: 1.1; text-align: center; font-weight: 600; color: #2A3B8D; padding: 0.25em 0 0.75em; margin-bottom: 0.75em; border-bottom: solid 1px #EEE;}


body.recruit p.align-center{ text-align: left !important;}

/* ENTRY FORM
-------------------------------------------------------------*/
.textSmall{ font-size: 1.1rem; line-height: 1.1; margin-top: 0.5em;}

/* color */
body.recruit #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #5562A4; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.recruit #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #2A3B8D; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}
body.recruit h3.heading span,
body.recruit .breadcrumb ul li:before{ color: #2A3B8D;}
body.recruit h3.heading:before,
body.recruit footer{ background: #2A3B8D;}
body.recruit footer .footNavi li a:hover{ background: #FFF; color: #2A3B8D; border-color: rgba(42,59,141,0.3);}
body.recruit h4.midashi{ border-left-color: #2A3B8D;}

section.form{ border: solid 5px #EEE; padding: 1.0em !important;}
.require span{ display: inline-block; font-size: 1.1rem; color: #FFF; line-height: 1.1; background: #F22D7D; padding: 0.2em 1.0em; border-radius: 5px; margin-left: 1.0em;}

/* Table */
.zeromail table,
.zeromail th,
.zeromail td {}
.zeromail table { width:50%; margin-bottom:1.5em;}
.zeromail table tr{ border-bottom: dotted 1px #EEE;}
.zeromail caption { margin:10px 0; padding:0.5em; background-color:#c9d9f0; color:#3762a8; font-weight:bold;}
.zeromail thead th,
.zeromail tfoot th { padding: 1.5em 1.0em;}
.zeromail thead td,
.zeromail tfoot td { background-color:#dbe5f3; text-align:center;}
.zeromail tbody th { width:100%; padding: 1.0em 0; padding-bottom: 0px; display: block;}
.zeromail td { padding: 1.0em 0; padding-top: 0.5em; text-align:left; display: block;}

/* Form */
.zeromail legend { display:none;}
.zeromail label{ margin:0 3px;}

.zeromail input[type=radio],
.zeromail input[type=checkbox] { margin-right:0.3em;}

.zeromail button,
.zeromail input[type=checkbox],
.zeromail input[type=radio],
.zeromail input[type=reset],
.zeromail input[type=submit] { padding:1px;}

.zeromail [type=check],
.zeromail [type=radio],
.zeromail [type=submit] { cursor: pointer;}

.zeromail [type=check] + label,
.zeromail [type=radio] + label { display: inline-block; cursor: pointer;}

.zeromail [type=text],
.zeromail [type=password],
.zeromail textarea { padding: 0.5em; border: 1px solid #DDD; border-radius: 2px; width: 95%;}

.zeromail input[type=text]:hover,
.zeromail [type=password]:hover,
.zeromail textarea:hover,
.zeromail input[type=text]:focus,
.zeromail [type=password]:focus,
.zeromail textarea:focus { background-color: #ECFBFF;}

/* Button */
.zeromail .button { text-align:center; margin-top:20px;}
.zeromail .button button { min-width:100px; _width:100px;}

.zeromail button[type],
.zeromail button[id]{ background: #2A3B8D; border: solid 2px #5562A4; cursor:pointer; color: #FFF; font-size: 2.1rem; line-height: 1.1; padding: 0.5em 4.0em; border-radius: 5px; margin: 0 10px;}

body.contact .zeromail button[type],
body.contact .zeromail button[id]{ background: #632E96; border: solid 2px #8258AB; cursor:pointer; color: #FFF; font-size: 2.1rem; line-height: 1.1; padding: 0.5em 4.0em; border-radius: 5px; margin: 0 10px;}

.zeromail button[type]:hover,
.zeromail button[id]:hover{}
.zeromail button[id=submit] {}
.zeromail button[id=submit]:hover {}

.zeromail button[id=myreset],
.zeromail button[id=close]{}

/* 確認・エラー画面(check,error) */
.zeromail #confirm td  { padding:1em;}

/*入力エラー*/
.zeromail strong.error { display:inline; padding:0; margin:0; border:0; background:none; color:#A82B2B;}

/* Message()のメッセージ */
.message { text-align:center;}

/*エラー*/
.zeromail span.error{ display:block; margin:1.5em 0; padding:1.5em 0; background: #FEEAF2; border: dotted 1px #F55797; text-align:center; color:#F22D7D;}

/*エラーなし*/
.zeromail span.confirm{ display:block; color:#339933; border:solid 1px; border-color:#D9F4C4; padding:10px;}

/* 送信完了(completion.html) */
#completion .success { margin:1.5em 50px; padding:1.5em 0; background-color:#e8f198; border:solid 1px #c6e148; text-align:center; color:#4e4c35;}

/* copyright */
.wtn_copyright { display: none !important;}


.bb {height:40px; width:200px; background: #632E96; border: solid 0.5px #8258AB; cursor:pointer; color: #FFF; font-size: 1.5rem; line-height: 1.1; padding: 1em 1.0em; border-radius: 5px; margin: 0 30px;}
.rk {height:40px; width:200px; background: #2A3B8D; border: solid 0.5px #5562A4; cursor:pointer; color: #FFF; font-size: 1.5rem; line-height: 1.1; padding: 1em 1.0em; border-radius: 5px; margin: 0 30px;}

/* ACCESS
-------------------------------------------------------------*/
.street_address{ text-align: center; font-size: 1.7rem; line-height: 1.1;}

.googlemap{ border: solid 5px #F6F6F6; margin-top: 2.5em;}
.googlemap iframe{ width: 100%; vertical-align: top;}

.station{ letter-spacing: -0.4em; width: 60%; margin: 2.5em auto 0px;}
.station h4{ width: 25%; display: inline-block; vertical-align: middle; letter-spacing: 0; font-size: 2.5rem; line-height: 1.1; font-weight: 600;}
.station ul{ width: 20%; display: inline-block; vertical-align: middle; letter-spacing: 0;}
.station ul li{ background: #FDEEE8; color: #EA5B1E; border: solid 1px #FCE7DD; font-size: 1.3rem; line-height: 1.1; text-align: center; padding: 0.25em 0; margin: 5px 0; border-radius: 3px;}
.station p{ width: 55%; display: inline-block; vertical-align: middle; letter-spacing: 0; padding-left: 3%;}

.direction{ letter-spacing: -0.4em;}
.direction li{ width: 30.666666%; display: inline-block; vertical-align: top; letter-spacing: 0; margin-right: 4%; position: relative;}
.direction li img{ width: 100%; height: auto;}
.direction li:last-child{ margin-right: 0px;}
.direction li span{ display: block; font-size: 1.3rem; line-height: 1.3; margin-top: 1.0em;}

/* CONTACT US
-------------------------------------------------------------*/
/* color */
body.contact #promo:before{ content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #8258AB; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); z-index: -1;}
body.contact #promo:after { content: ''; position: absolute; top: 0; left: 0; width: 120%; height: 100%; margin: -30px -10% 0; background: #632E96; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); z-index: -1;}
body.contact h3.heading span,
body.contact .breadcrumb ul li:before{ color: #632E96;}
body.contact h3.heading:before,
body.contact footer{ background: #632E96;}
body.contact footer .footNavi li a:hover{ background: #FFF; color: #632E96; border-color: rgba(99,46,150,0.3);}

p.phone{ text-align: center; margin-top: 1.5em;}
p.phone a{ display: inline-block; font-size: 3.1rem; font-family: DIN; text-decoration: none; padding-left: 1.0em; color: rgba(51,51,51,1.0); position: relative;}
p.phone a:before{ content: "\f098"; font-family: FontAwesome; position: absolute; top: 50%; left: 0px; transform: translateY(-50%);}
p.phone a:hover{ color: rgba(51,51,51,0.6);}
p.phone span{ display: block; text-align: center;}

/* PRIVACY POLICY
-------------------------------------------------------------*/
.responsible{ text-align: center; margin-top: 2.0em;}
.responsible p{ display: inline-block; border: solid 3px #EEE; padding: 1.0em 3.0em; line-height: 1.3; text-align: center;}

.policyBox{ border: solid 1px #E4E4E4;}
.policyBox h3{ text-align: center; font-size: 2.1rem; line-height: 1.1; color: #FFF; background: #EA5B1E; border-bottom: solid 1px #E4E4E4; padding: 0.75em 0;}
.policyBox .inner{ padding: 1.5em;}
.policyBox .inner p{ text-align: center;}
.policyBox .inner h4{ font-size: 1.5rem; line-height: 1.1; font-weight: 600; margin: 1.0em 0 0.5em; text-align: center;}
.policyBox .inner p.address a{ display: inline-block; margin-left: 0.5em;}

/* SITE POLICY
-------------------------------------------------------------*/
.listStyle{ padding-left: 20px; margin-bottom: 1.0em;}
.listStyle li{ list-style-position: outside; position: relative; padding: 1.0em 0; line-height: 1.2;}
.listStyle li:before{ content: ""; width: 100%; height: 1px; border-bottom: dotted 1px #E4E4E4; position: absolute; bottom: 0px; left: -20px;}
.listStyle.alphabet li{ list-style-type: lower-latin;}
.listStyle.number li{ list-style-type: decimal;}
.listStyle.disc li{ list-style-type: disc;}
.listStyle.check li:after{ content: "\f046"; font-family: FontAwesome; position: absolute; top: 1.1em; left: -20px; color: #F55797;}

/*=============================================================
 common
=============================================================*/

body{ margin:0; padding:0; text-align:center; font-size:1.3rem; line-height:1.5em; font-family: "ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro," メイリオ", Meiryo, Osaka," ＭＳ Ｐゴシック", MS PGothic," sans-serif"; color:#333; height:100%; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background: #FFF;}
a{color:#EA5B1E; text-decoration:underline; transition: all 0.2s ease 0s;}
a:hover{color:#F08D62; text-decoration:none;}

/*-------- clearfix ---------*/
.clearfix { zoom:1;}
.clearfix:after{ content: ""; display: block; clear: both;}
.clearfloat { clear: both; height: 0; font-size: 1px; line-height: 0px;}

/*---------- margin ----------*/
.mt-none{ margin-top:0px !important}
.mt-05{ margin-top:5px !important}
.mt-1em{ margin-top:1.0em !important}
.mt-2em{ margin-top:2.0em !important}
.mt-3em{ margin-top:3.0em !important}
.mt-4em{ margin-top:4.0em !important}
.mt-5em{ margin-top:5.0em !important}
.mt-6em{ margin-top:6.0em !important}
.mt-7em{ margin-top:7.0em !important}
.mt-8em{ margin-top:8.0em !important}
.mt-9em{ margin-top:9.0em !important}
.mt-10em{ margin-top:10.0em !important}

/*---------- align ----------*/
.align-left{ text-align: left;}
.align-right{ text-align: right;}
.align-center{ text-align: center;}

/*---------- float ----------*/
.float-left{ float:left;}
.float-right{ float:right;}

/*---------- image ----------*/
.img-left{ float:left; margin: 1.0em 4% 0 0;}
.img-right{ float:right; margin: 1.0em 0 0 4%;}

/*----- clearfix -----*/
.clearfix { zoom:1;}
.clearfix:after{ content: ""; display: block; clear: both;}
.clearfloat { clear: both; height: 0; font-size: 1px; line-height: 0px;}

/*=============================================================
 layout
=============================================================*/

/* Header
-------------------------------------------------------------*/
header{ width: 100%; margin: 0px auto; background: #FFF;}
header h1{ width: 40%; margin: 0px auto; padding: 1.0em 0;}
header h1 img{ width: 100%; height: auto;}
header nav#navigation{ display: none;}

.drawer-nav{ position:fixed; z-index:10000; top:0; overflow:hidden; width:16.25rem; height:100%; color:#222; background-color:#fff;}
.drawer-brand{ font-size:1.5rem; font-weight:700; line-height:3.75rem; display:block; padding-right:.75rem; padding-left:.75rem; text-decoration:none; color:#222;}
.drawer-menu{ margin:0; padding:0; list-style:none;}
.drawer-menu-item{ font-size: 1.3rem; line-height: 1.1; display:block; padding: 1.0em 1.0em; text-decoration:none; color:#333; border-bottom: solid 1px #EEE;}
.drawer-menu-item:hover{ text-decoration:underline; color:#555; background-color:transparent;}
.drawer-overlay{ position:fixed; z-index:1; top:0; left:0; display:none; width:100%; height:100%; background-color: rgba(234,91,30,0.6);}
.drawer-open .drawer-overlay{ display:block;}
.drawer--top .drawer-nav{ top:-100%; left:0; width:100%; height:auto; max-height:100%; -webkit-transition:top .6s cubic-bezier(.19,1,.22,1); transition:top .6s cubic-bezier(.19,1,.22,1);}
.drawer--top.drawer-open .drawer-nav{ top:0;}
.drawer--top .drawer-hamburger,.drawer--top.drawer-open .drawer-hamburger{ right:0;}
.drawer--left .drawer-nav{ left:-16.25rem; -webkit-transition:left .6s cubic-bezier(.19,1,.22,1); transition:left .6s cubic-bezier(.19,1,.22,1);}
.drawer--left .drawer-hamburger,.drawer--left.drawer-open .drawer-nav,.drawer--left.drawer-open .drawer-navbar .drawer-hamburger{ left:0;}
.drawer--left.drawer-open .drawer-hamburger{ left:16.25rem;}
.drawer--right .drawer-nav{ right:-16.25rem; -webkit-transition:right .6s cubic-bezier(.19,1,.22,1); transition:right .6s cubic-bezier(.19,1,.22,1);}
.drawer--right .drawer-hamburger,.drawer--right.drawer-open .drawer-nav,.drawer--right.drawer-open .drawer-navbar .drawer-hamburger{ right:0;}
.drawer--right.drawer-open .drawer-hamburger{ right:16.25rem;}
.drawer-hamburger{ position:fixed; z-index:4; top:0; display:block; box-sizing:content-box; width:2rem; padding:0; padding:18px .75rem 30px; -webkit-transition:all .6s cubic-bezier(.19,1,.22,1); transition:all .6s cubic-bezier(.19,1,.22,1); -webkit-transform:translateZ(0); transform:translateZ(0); border:0; outline:0; background-color:transparent;}
.drawer-hamburger:hover{ cursor:pointer; background-color:transparent;}
.drawer-hamburger-icon{ position:relative; display:block; margin-top:10px;}
.drawer-hamburger-icon,.drawer-hamburger-icon:after,.drawer-hamburger-icon:before{ width:100%; height:2px; -webkit-transition:all .6s cubic-bezier(.19,1,.22,1); transition:all .6s cubic-bezier(.19,1,.22,1); background-color:#222;}
.drawer-hamburger-icon:after,.drawer-hamburger-icon:before{ position:absolute; top:-6px; left:0; content:' ';}
.drawer-hamburger-icon:after{ top:6px;}
.drawer-open .drawer-hamburger-icon{ background-color:transparent;}
.drawer-open .drawer-hamburger-icon:after,.drawer-open .drawer-hamburger-icon:before{ top:0;}
.drawer-open .drawer-hamburger-icon:before{ -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg);}
.drawer-open .drawer-hamburger-icon:after{ -webkit-transform:rotate(-45deg); -ms-transform:rotate(-45deg); transform:rotate(-45deg);}
.sr-only{ position:absolute; overflow:hidden; clip:rect(0,0,0,0); width:1px; height:1px; margin:-1px; padding:0; border:0;}
.sr-only-focusable:active,.sr-only-focusable:focus{ position:static; overflow:visible; clip:auto; width:auto; height:auto; margin:0;}
.drawer--sidebar,.drawer--sidebar .drawer-contents{ background-color:#fff;}
@media (min-width:64em){ .drawer--sidebar .drawer-hamburger{ display:none; visibility:hidden;}
.drawer--sidebar .drawer-nav{ display:block; -webkit-transform:none; -ms-transform:none; transform:none; position:fixed; width:12.5rem; height:100%;}
.drawer--sidebar.drawer--left .drawer-nav{ left:0; border-right:1px solid #ddd;}
.drawer--sidebar.drawer--left .drawer-contents{ margin-left:12.5rem;}
.drawer--sidebar.drawer--right .drawer-nav{ right:0; border-left:1px solid #ddd;}
.drawer--sidebar.drawer--right .drawer-contents{ margin-right:12.5rem;}
.drawer--sidebar .drawer-container{ max-width:48rem;}
;}
@media (min-width:75em){ .drawer--sidebar .drawer-nav{ width:16.25rem;}
.drawer--sidebar.drawer--left .drawer-contents{ margin-left:16.25rem;}
.drawer--sidebar.drawer--right .drawer-contents{ margin-right:16.25rem;}
.drawer--sidebar .drawer-container{ max-width:60rem;}
;}
.drawer--navbarTopGutter{ padding-top:3.75rem;}
.drawer-navbar .drawer-navbar-header{ border-bottom:1px solid #ddd; background-color:#fff;}
.drawer-navbar{ z-index:3; top:0; width:100%;}
.drawer-navbar--fixed{ position:fixed;}
.drawer-navbar-header{ position:relative; z-index:3; box-sizing:border-box; width:100%; height:3.75rem; padding:0 .75rem; text-align:center;}
.drawer-navbar .drawer-brand{ line-height:3.75rem; display:inline-block; padding-top:0; padding-bottom:0; text-decoration:none;}
.drawer-navbar .drawer-brand:hover{ background-color:transparent;}
.drawer-navbar .drawer-nav{ padding-top:3.75rem;}
.drawer-navbar .drawer-menu{ padding-bottom:7.5rem;}
@media (min-width:64em){ .drawer-navbar{ height:3.75rem; border-bottom:1px solid #ddd; background-color:#fff;}
.drawer-navbar .drawer-navbar-header{ position:relative; display:block; float:left; width:auto; padding:0; border:0;}
.drawer-navbar .drawer-menu--right{ float:right;}
.drawer-navbar .drawer-menu li{ float:left;}
.drawer-navbar .drawer-menu-item{ line-height:3.75rem; padding-top:0; padding-bottom:0;}
.drawer-navbar .drawer-hamburger{ display:none;}
.drawer-navbar .drawer-nav{ position:relative; left:0; overflow:visible; width:auto; height:3.75rem; padding-top:0; -webkit-transform:translateZ(0); transform:translateZ(0);}
.drawer-navbar .drawer-menu{ padding:0;}
.drawer-navbar .drawer-dropdown-menu{ position:absolute; width:16.25rem; border:1px solid #ddd;}
.drawer-navbar .drawer-dropdown-menu-item{ padding-left:.75rem;}
;}
.drawer-dropdown-menu{ display:none; box-sizing:border-box; width:100%; margin:0; padding:0; background-color:#fff;}
.drawer-dropdown-menu>li{ width:100%; list-style:none;}
.drawer-dropdown-menu-item{ display: block; color: #333; text-decoration: none; font-size: 1.3rem; line-height: 1.1; border-bottom: solid 1px #EEE; background: #F9F9F9; padding: 0.75em 1.0em;}
.drawer-dropdown-menu-item:hover{ text-decoration:underline; color:#555; background-color:transparent;}
.drawer-dropdown.open>.drawer-dropdown-menu{ display:block;}
.drawer-dropdown .drawer-caret{ display:inline-block; width:0; height:0; margin-left:4px; -webkit-transition:opacity .2s ease,-webkit-transform .2s ease; transition:opacity .2s ease,-webkit-transform .2s ease; transition:transform .2s ease,opacity .2s ease; transition:transform .2s ease,opacity .2s ease,-webkit-transform .2s ease; -webkit-transform:rotate(0deg); -ms-transform:rotate(0deg); transform:rotate(0deg); vertical-align:middle; border-top:4px solid; border-right:4px solid transparent; border-left:4px solid transparent;}
.drawer-dropdown.open .drawer-caret{ -webkit-transform:rotate(180deg); -ms-transform:rotate(180deg); transform:rotate(180deg);}
.drawer-container{ margin-right:auto; margin-left:auto;}
@media (min-width:64em){ .drawer-container{ max-width:60rem;}
;}
@media (min-width:75em){ .drawer-container{ max-width:70rem;}
;}

/* container
-------------------------------------------------------------*/
#container{ width: 100%; margin: 0px auto; padding-bottom: 25px;}
#container section{ width: 90%; margin: 0px auto; padding: 25px 0; position: relative;}

/* Footer
-------------------------------------------------------------*/
footer{ width: 100%; margin: 0px auto; background: #EA5B1E; padding: 25px 0 15px 0;}
footer h2{ width: 30%; margin: 0px auto;}
footer h2 img{ width: 100%; height: auto;}
footer .footSns{ width: 60%; margin: 15px auto; text-align: center; letter-spacing: -0.4em;}
footer .footSns li{ width: 20.666666%; display: inline-block; vertical-align: top; letter-spacing: 0;}
footer .footSns li:nth-child(2n+1){ margin: 0 4%;}
footer .footSns li img{ width: 100%; height: auto;}
footer .footSns li a{ opacity: 1.0;}
footer .footSns li a:hover{ opacity: 0.6;}
footer .footNavi{ width: 70%; margin: 0px auto; text-align: center; border-top: solid 1px rgba(255,255,255,0.1); padding: 15px 0; letter-spacing: -0.4em;}
footer .footNavi li{ width: 100%; margin: 5px 0; display: inline-block; vertical-align: top; letter-spacing: 0;}
footer .footNavi li a{ display: block; font-size: 1.1rem; line-height: 1.1; font-weight: 600; text-decoration: none; color: #FFF; border: solid 2px #FFF; border-radius: 50px; padding: 1.0em 0; text-align: center; position: relative;}
footer .footNavi li a:after{ content: "\f105"; font-family: FontAwesome; font-weight: normal; position: absolute; top: 50%; right: 1.5em; transform: translateY(-50%); transition: all 0.2s ease 0s;}
footer .footNavi li a:hover:after{ right: 1.0em;}
footer .footNavi li a:hover{ background: #FFF; color: rgba(234,91,30,1); border-color: rgba(234,91,30,0.3);}
footer .copyright{ text-align: center; font-size: 1.0rem; line-height: 1.1; color: #FFF;}

/* modal */
.modal-content { position:fixed; display:none; z-index:102; width:80%; margin:0; padding:1.0em; background:#fff; border-radius: 10px; box-shadow: 0px 0px 5px rgba(0,0,0,0.1);}
.modal-content p { text-align: center;}
.modal-content img{ width: 100%; height: auto;}
.modal-overlay { z-index:101; display:none; position:fixed; top:0; left:0; width:100%; height:120%; background-color:rgba(0,0,0,0.75);}
.modal-open { cursor: pointer;}
.modal-close { margin-top: 1.5em; display: inline-block; border: solid 1px #333; color: #333; text-decoration: none; padding: 0.25em 1.5em; line-height: 1.1; border-radius: 50px; cursor: pointer;}
.modal-close:hover{ color: #FFF; background: #333; border-color: #333;}
}

/*----------------------------------------------------------*/

#PageTop{ position:fixed; bottom:60px; right:100px; z-index:100;}
@media screen and (max-width: 1250px) {#PageTop{ position:fixed; bottom:50px; right:50px;}
}
@media screen and (max-width: 1150px) {#PageTop{ position:fixed; bottom:50px; right:10px;}
}
@media screen and (max-width: 1080px) {#PageTop{ display:none;}
}