@charset "UTF-8";

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

目次
#base要素/共通
#Container系
#header
	.siteLogo
	.navigationList
	.globalNavigation
	.menuIcon
  .fixedHeader

footer .footerSiteMap
.localNavigation
.fixedLocalNav
.pageTopLink

共通------------------------------------
.modalMenu
.ghostButton

#contact系
	.contactHeader
	.contactContentsArea
	.contactPageTitle
#js-系
.postalCodeModal
.pageTitleArea

.lower ------------------------------------

.lowerPhotoArea
.loweTextArea
.lowerContentsNav

RWD 共通 ---------------------------------

.clearfix
------------------------------------------- */


/* -------------------------------------------------------
#base要素
------------------------------------------------------- */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,
code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,l,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,
nav,output,ruby,section,summary,time,mark,audio,video {
    margin: 0;
    padding: 0
}

h1,h2,h3,h4,h5,h6,table,input,textarea,select,option,button {
    font-size: 100%
}

article,aside,details,figcaption,figure,footer,header,menu,nav,section,main {
    display: block
}

input,textarea {
    margin: 0;
    padding: 0
}

ol,ul {
    list-style: none;
    margin: 0;
    padding: 0
}

dt,dd{
	    margin: 0;
	    padding: 0
}


table {
    border-collapse: collapse;
    border-spacing: 0
}

caption,th {
    text-align: left
}

:focus {
    outline: 0
}

img,a img {
    border: none
}

a {
    outline: 0;
    cursor: pointer
}

html {
    height: 100%;
    line-height: 1.8;
    background: #fff;
}

body {
    position: relative;
    min-height: 100%;
    color: #333;
    -webkit-text-size-adjust: none;
				margin: auto 0;

}

@media only screen and (max-width: 767px) {
    body {
        font-family:"メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
			margin: 0;
    }
}

@media only screen and (min-width: 768px) {
    body {
        font-family:"ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","Hiragino Kaku Gothic Pro";
    }
}

a {
    text-decoration: none;
    color: #000
}

@media only screen and (min-width: 768px) {
    a:hover {
        color:#666
    }
}

table th {
    vertical-align: top
}

table td {
    vertical-align: top
}


/* --------------------------------------
.ghostButton
--------------------------------------- */

/* .anchr --------------------- */

.anchr {
	display: block;
	padding-top: 90px;
	margin-top: -90px;
    pointer-events: none;
}

.anchr {
}

@media only screen and (max-width: 767px){
	.anchr {
		display: block;
    padding-top: 40px;
    margin-top: -40px;
	}
}




/* ------------------------------------------
Container系
------------------------------------------- */

.rootContainer {
    overflow: hidden
}

@media only screen and (min-width: 1600px) {
    .rootContainer {
        width:1600px;
        margin: auto
    }
}

@media only screen and (max-width: 767px) {
    .lowerContentContainer {
        padding:40px 6%
    }

    .work01	.lowerContentContainer {
        padding:10px 6% 40px 6%;
    }
}

@media only screen and (min-width: 768px) {
    .lowerContentContainer {
        padding:80px 6%;
    }
}

/* Small devices: Tablets (≥768px) */
@media (min-width: 768px) and (max-width: 991px) {
    .lowerContentContainer {
        padding:80px 6%;
    }
}

@media only screen and (min-width: 980px) {
    .lowerContentContainer {
        padding:80px 0;
        width: 920px;
        margin: auto
    }
}

@media only screen and (min-width: 980px) {
    .asideContainer {
        display:table;
        width: 100%;
    }
}

@media only screen and (max-width: 767px) {
    .sectionBlock {
        margin:35px 0 0 0
    }
}

@media only screen and (min-width: 768px) {
    .sectionBlock {
        margin:84px 0 0 0
    }
}

.sectionBlock:first-child {
    margin: 0
}

@media only screen and (max-width: 767px) {
    .sectionInnerBlock {
        margin:25px 0 0 0
    }
}

@media only screen and (min-width: 768px) {
    .sectionInnerBlock {
        margin:54px 0 0 0
    }
}

/* after/三角形について スタイル */

@media only screen and (max-width: 767px) {
    .sectionHomeWork:after,
		.section03:after,
		.footerSiteMap:after {
	    left: 41%!important;
	    top: 99.9%!important;
    }
}



/* -------------------------------------------------------
#header
------------------------------------------------------- */

@media only screen and (max-width: 767px) {
      .header.type-home {
          position:absolute;
          top: 8px;
          right: 8px;
          z-index: 100;
      }

    .header.type-lower {
			height: 50px;
			padding: 0 0 0 3%;
			position: fixed;
			width: 94%;
			background: #1b76d1;
			z-index: 1000;
    }

		.sub .header.type-lower {
			background: #1c75d2;
			font-weight: normal;
			z-index: 100;
		}

		.sub .header.type-lower a {
				color: #fff;

		}
}

@media only screen and (min-width: 768px) {
    .header {
        box-sizing:border-box;
        height: 50px;
        padding: 0 0 0 6%
    }
}

@media only screen and (min-width: 980px) {
    .header {
        height:auto;
        min-height: 70px;
        padding: 18px 6%;
		    border-bottom: 3px solid #1b76d0;
    }

    .header:after {
        content: "";
        clear: both;
        display: block;
        overflow: hidden
    }
}

@media only screen and (min-width: 1024px) {
    .header {
    padding: 20px 3% 30px;
    }

    .header .navigationList>li {
    padding: 0 3px;
    }
}


/*.siteLogo -----------------------------*/

.siteLogo {
    float: left;
    padding: 6px 0 0 0
}


@media only screen and (max-width: 980px) {
	.siteLogo.siteLogo-lowerHeader {
	    padding: 28px 0 0 0
	}

	.sub .siteLogo.siteLogo-lowerHeader {
	    padding: 4px 0 0 0
	}
}

@media only screen and (min-width: 980px) {
    .siteLogo {
        height:34px;
        padding: 0;
				top: 0px;
	    position: relative;
    }
}

.siteLogo a {
    display: block;
		font-weight: bold;
		padding-top: 4px;
    position: absolute;
}

.fixedHeader .siteLogo a {
		display: inline-block;
    font-weight: bold;
    padding-right: 11px;
    width: 340px;
    padding-top: 0;
    top: -7px;
}

.siteLogo .time{
  display: none;
  font-size: 0.7em;
  color: #7a6a56;
  position: relative;
  top: 34.5px;
  left: 79px;
  font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
}

.fixedHeader .siteLogo .time {
    display: inline-block;
    font-size: 0.7em;
}

/* Extra small devices: Phones (<768px) */
@media (max-width: 767px) {
	.siteLogo a {
		display: none;

	}

	.sub .siteLogo a {
		display: block;

	}

	.siteLogo .time {
		color: #fff;
		text-indent: -0.6em;
    font-size: 0.5em;
	}

	.sub .siteLogo .time {
    top: -0.5em;
    position: relative;
	}
}

/* Small devices: Tablets (≥768px) */
@media (min-width: 768px) and (max-width: 991px) {
  .siteLogo a {
    padding-top: 6px;
    position: absolute;
    left: 16px;
  }

	.siteLogo .time {
     margin-top: -4px;
  }
  .siteLogo.siteLogo-lowerHeader {
   padding: 3px 0 0 0;
  }
}

/* // 大デバイス（デスクトップ, 992px 以上） */
@media (min-width: 992px) and (max-width: 1199.99px) {
  .siteLogo a {
    padding-top: 6px;
    position: absolute;
    left: -6px;
  }
 }

@media only screen and (min-width: 980px) {
    .siteLogo.siteLogo-lowerHeader {
        padding:0
    }
}

.siteLogo.siteLogo-lowerHeader img {
    display: block;
    height: auto;
    width: 220px;
}


/* Extra small devices: Phones (<768px) */
@media only screen and (max-width: 767px) {
  .siteLogo.siteLogo-lowerHeader img {
      display: block;
      height: auto;
      width: 160px
  }
}


/* Small devices: Tablets (≥768px) */
@media (min-width: 768px) and (max-width: 991px) {
    .siteLogo.siteLogo-lowerHeader img {
      width: 150px;
    }
}

/* // 大デバイス（デスクトップ, 992px 以上） */
@media (min-width: 992px) and (max-width: 1199.99px) {
  .siteLogo.siteLogo-lowerHeader img {
      width: 190px;
  }
 }


/* siteLogo-fixedHeader 固定*/
.siteLogo.siteLogo-fixedHeader img {
	display: block;
	width: 100%;
	height: auto;
	padding-top: 7px;
	font-weight: bold;
}



/*.navigationList
	上部固定のナビ（グローパルナビのインナーブ）
---------------------------------------*/

.navigationList {
    display: table;
    float: left;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    padding: 6px 0 0 0;
    font-size: 14px;
    font-size: .875rem
}

@media only screen and (min-width: 768px) {
    .navigationList>li {
        display:table-cell
    }
}

@media only screen and (min-width: 980px) {
    .navigationList>li {
        padding:0 8px
    }

		.navigationList>li a{
			letter-spacing: 0.1em;
		}

		.navigationList>li a.ss{
			letter-spacing: 0.06em;
		}
}

.navigationList>li a:hover {
    color: #666
}

.navigationList>li.current a {
    color: #1b76d1
}

.ie-all .navigationList {
    padding: 7px 0 0 0
}

/* .globalNavigation --------------------*/

.globalNavigation {
    float: right;
    display: none
}

.globalNavigation:after {
    content: "";
    clear: both;
    display: block;
    overflow: hidden
}

@media only screen and (min-width: 980px) {
    .globalNavigation {
        display:block;
        padding: 3px 0 0 200px
    }
}

@media only screen and (min-width: 980px) {
    .globalNavigation.globalNavigation-lower {
        padding:8px 0 0 0
    }
}

.globalNavigation.globalNavigation-fixedHeader {
    padding: 3px 0 0 0
}

/* sp用 右上のボタン -----------------------*/

.menuIcon {
    box-sizing: border-box;
    width: 50px;
    height: 50px;
    padding: 12px 0 0 0
}

@media only screen and (min-width: 980px) {
    .menuIcon {
        display:none
    }
}

.menuIcon:hover {
    cursor: pointer
}

.menuIcon .inner {
    position: relative
}

.menuIcon.menuIcon-home {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1200;
    transition: background 0.6s 0s ease
}

.menuIcon.menuIcon-home .line {
    position: relative;
    top: 0;
    margin: auto;
    height: 2px;
    height: 2px;
    width: 18px;
    transition: all 0.6s 0s ease;
    -webkit-transform: rotate(0);
    transform: rotate(0)
}

@media only screen and (max-width: 767px) {
    .menuIcon.menuIcon-home .line {
        background:#fff
    }
}

@media only screen and (min-width: 768px) {
    .menuIcon.menuIcon-home .line {
        background:#000
    }
}

.menuIcon.menuIcon-home .line .before {
    position: absolute;
    left: 0;
    display: block;
    height: 2px;
    top: 6px;
    width: 18px;
    transition: opacity 0.2s 0s ease
}

@media only screen and (max-width: 767px) {
    .menuIcon.menuIcon-home .line .before {
        background:#fff
    }
}

@media only screen and (min-width: 768px) {
    .menuIcon.menuIcon-home .line .before {
        background:#000
    }
}

.menuIcon.menuIcon-home .line .after {
    position: absolute;
    display: block;
    height: 2px;
    top: 12px;
    width: 18px;
    transition: -webkit-transform 0.6s 0s ease;
    transition: transform 0.6s 0s ease;
    transition: transform 0.6s 0s ease, -webkit-transform 0.6s 0s ease;
    -webkit-transform: rotate(0);
    transform: rotate(0)
}

@media only screen and (max-width: 767px) {
    .menuIcon.menuIcon-home .line .after {
        background:#fff
    }
}

@media only screen and (min-width: 768px) {
    .menuIcon.menuIcon-home .line .after {
        background:#000
    }
}

.menuIcon.menuIcon-home .text {
    font-weight: bold;
    text-align: center;
    padding: 15px 0 0 0;
    font-size: 9px;
    font-size: .5625rem
}

@media only screen and (max-width: 767px) {
    .menuIcon.menuIcon-home .text {
        color:#fff
    }
}

@media only screen and (min-width: 768px) {
    .menuIcon.menuIcon-home .text {
        color:#000
    }
}

.menuIcon.menuIcon-home.showMenu .line {
    top: 5px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    background: #fff
}

.menuIcon.menuIcon-home.showMenu .line .before {
    opacity: 0;
    background: #fff
}

.menuIcon.menuIcon-home.showMenu .line .after {
    background: #fff;
    top: 0;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.menuIcon.menuIcon-home.showMenu .text {
    color: #fff
}

.menuIcon.menuIcon-lower {
    position: fixed;
    top: 0;
    right: 0;
    background: #1b76d1;
    z-index: 1200;
    transition: background 0.6s 0s ease
}

.menuIcon.menuIcon-lower .line {
    position: relative;
    top: 0;
    margin: auto;
    height: 2px;
    height: 2px;
    width: 18px;
    transition: all 0.6s 0s ease;
    -webkit-transform: rotate(0);
    transform: rotate(0)
}

@media only screen and (max-width: 767px) {
    .menuIcon.menuIcon-lower .line {
        background:#fff
    }
}

@media only screen and (min-width: 768px) {
    .menuIcon.menuIcon-lower .line {
        background:#fff
    }
}

.menuIcon.menuIcon-lower .line .before {
    position: absolute;
    left: 0;
    display: block;
    height: 2px;
    top: 6px;
    width: 18px;
    transition: opacity 0.2s 0s ease
}

@media only screen and (max-width: 767px) {
    .menuIcon.menuIcon-lower .line .before {
        background:#fff
    }
}

@media only screen and (min-width: 768px) {
    .menuIcon.menuIcon-lower .line .before {
        background:#fff
    }
}

.menuIcon.menuIcon-lower .line .after {
    position: absolute;
    display: block;
    height: 2px;
    top: 12px;
    width: 18px;
    transition: -webkit-transform 0.6s 0s ease;
    transition: transform 0.6s 0s ease;
    transition: transform 0.6s 0s ease, -webkit-transform 0.6s 0s ease;
    -webkit-transform: rotate(0);
    transform: rotate(0)
}

@media only screen and (max-width: 767px) {
    .menuIcon.menuIcon-lower .line .after {
        background:#fff
    }
}

@media only screen and (min-width: 768px) {
    .menuIcon.menuIcon-lower .line .after {
        background:#fff
    }
}

.menuIcon.menuIcon-lower .text {
    font-weight: bold;
    text-align: center;
    padding: 15px 0 0 0;
    font-size: 9px;
    font-size: .5625rem
}

@media only screen and (max-width: 767px) {
    .menuIcon.menuIcon-lower .text {
        color:#fff
    }
}

@media only screen and (min-width: 768px) {
    .menuIcon.menuIcon-lower .text {
        color:#fff
    }
}

.menuIcon.menuIcon-lower.showMenu {
    background: none
}

.menuIcon.menuIcon-lower.showMenu .line {
    top: 5px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.menuIcon.menuIcon-lower.showMenu .line .before {
    opacity: 0
}

.menuIcon.menuIcon-lower.showMenu .line .after {
    top: 0;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}


/* -------------------------------------------------------
.fixedHeader
------------------------------------------------------- */

.fixedHeader {
    position: fixed;
    top: -4px;
    left: 0;
    box-sizing: border-box;
    width: 100%;
    background: #fff;
    box-shadow: 0px 4px 2px -2px rgba(0,0,0,0.1);
    z-index: 2000;
    transition: all 0.4s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%)
}

.fixedHeader .inner {
    padding: 9px 6% 7px 6%;
    box-sizing: border-box
}

.fixedHeader .inner:after {
    content: "";
    clear: both;
    display: block;
    overflow: hidden
}

@media only screen and (max-width: 767px) {
    /*.fixedHeader.show {
        top:0;
			}*/
}

@media only screen and (min-width: 1600px) {
    .fixedHeader .inner {
        width:1600px;
        margin: auto;
    }
}

@media only screen and (min-width: 980px) {
    .fixedHeader.show {
        top:0;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}


/* -------------------------------------------------------
footer .footerSiteMap
------------------------------------------------------- */

.footer {
	background: #1b76d1;
	text-align: center;
}


.footerSiteMap .footerLogo p{
	color: #fff;
	padding-bottom: 5px;
  font-size: 1.1em;
}


@media only screen and (max-width: 767px) {
    .footerSiteMap {
        padding:30px 6% 10px 6%;
    }

		.footerSiteMap .footerLogo p{
			padding-bottom: 2px;
			font-size: 1.2em;
			font-weight: bold;
	    text-indent: 0.7em;
		}
}


 /* Small devices: Tablets (≥768px) */
 @media (min-width: 768px) and (max-width: 991px) {
  .footerSiteMap .footerLogo p {
    padding-top: 30px;
  }
 }

@media only screen and (min-width: 980px) {
    .footerSiteMap {
        padding: 80px 10% 50px;
    }
}

@media only screen and (min-width: 1280px) {
    /*.footerSiteMap {
        padding:80px 15% 80px 15%;
    }*/
}

.footerSiteMap:after {
    content: "";
    clear: both;
    display: block;
    overflow: hidden;

}


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

    .footerSiteMap .footerBlock {
				margin: 0 auto;
        box-sizing: border-box;
        padding: 0 15px 0 0;
				text-align: center;
				display: inline-block;
    }

    .footerSiteMap .footerBlock ul{
			display: flex;
			justify-content: center;
	    padding-left: 2em;
			float: left;
		}

		.footerSiteMap .footerBlock ul:last-child{
			padding-left: 0;
		}
}


.footerSiteMap .footerBlock .menu-lv1>li {
    /* font-weight: bold; */
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro"
}

@media only screen and (max-width: 767px) {
	.footerSiteMap .footerBlock {
			padding-left: 23px;
		}

    .footerSiteMap .footerBlock ul{
			display: flex;
		  flex-direction: column;
			float: left;
			width: 45%;
		}

    .footerSiteMap .footerBlock ul>li {
        margin:0 0 2px 0;
				/*width: 50%;*/
    }
}

@media only screen and (min-width: 768px) {
    .footerSiteMap .footerBlock .menu-lv1>li {
        font-size:14px;
        font-size: .875rem;
    }
}


.footerSiteMap .footerBlock .menu-lv1>li a {
    display: inline-block;
    margin: 0 20px 8px 0;
		color:#fff;
}

.footerSiteMap .footerBlock .menu-lv1>li a:hover {
	color: #5ca5ef;
	font-size: 1em;
	font-weight: bold;
}

@media only screen and (min-width: 768px) {
    .footerSiteMap .footerBlock .menu-lv1.menu-home {
        margin:28px 0 0 0
    }
}

.footerSiteMap .footerBlock .menu-lv1.menu-home a {
    display: inline-block;
    padding: 0 14px 0 0;
    background: url("../img/icon_blank_black.svg") no-repeat 100%
}

@media only screen and (min-width: 768px) {
    .footerSiteMap .footerBlock .menu-lv1.menu-recruitHome {
        margin:0 0 28px 0
    }
}

@media only screen and (max-width: 767px) {
    .footerSiteMap .footerBlock .menu-lv2 {
        display:none
    }

    .footerSiteMap .footerLogo {
			margin-bottom: 8px;
		}

		.footerSiteMap .footerBlock .menu-lv1>li a {
		    margin: 0 0px 5px 0;
				letter-spacing: 0.1em;
		}
}

.footerSiteMap .footerBlock .menu-lv2>li {
    font-weight: normal;
    font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    font-size: 12px;
    font-size: .75rem
}

.footerSiteMap .footerBlock .menu-lv2>li a {
    display: inline-block;
    margin: 0 0 4px 0
}

/* footerCopy ----------------------------*/
.footerCopy {
		color: #fff;
    border-top: 1px solid #d9d9d9
}

@media only screen and (max-width: 767px) {
    .footerCopy {
        font-size:12px;
        font-size: .75rem;
        padding: 20px 6%
    }
}

@media only screen and (min-width: 768px) {
    .footerCopy {
        padding:15px 0 15px 0;
        text-align: center
    }
}

/* -------------------------------------------------------
.localNavigation
グローバルナビの下にあるメニュー
------------------------------------------------------- */


.localNavigation::-webkit-scrollbar {
    display: none
}

.localNavigation {
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    font-weight: bold;
    background: #f2f2f2;
    width: 100%;
    font-size: 12px;
    font-size: .75rem;
    overflow: hidden;
    white-space: nowrap;
    height: 36px;

		/* try */
		display: none;
}

@media only screen and (min-width: 768px) {
    .localNavigation {
        position:absolute;
        z-index: 1000;
        overflow: visible;
        text-align: center;
        font-size: 14px;
        font-size: .875rem;
        width: 100%;
        padding: 0;
        height: auto
    }
}

@media only screen and (min-width: 980px) {
    .localNavigation {
        z-index:1000
    }
}

@media only screen and (min-width: 1600px) {
    .localNavigation {
        width:1600px
    }
}

.localNavigation.show {
    position: fixed;
    top: 0
}

@media only screen and (max-width: 767px) {
    .localNavigation .inner {
        position:relative;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        -webkit-scrollbar: none
    }
}

.localNavigation .slider:after {
    content: "";
    clear: both;
    display: block;
    overflow: hidden
}

@media only screen and (max-width: 767px) {
    .localNavigation .slider {
        position:absolute;
        padding: 0 6%;
        top: 0;
        left: 0;
        opacity: 0;
        -webkit-transform: translateX(-250px);
        transform: translateX(-250px)
    }
}

@media only screen and (min-width: 768px) {
    .localNavigation .slider {
        width:auto;
        display: inline-block;
        vertical-align: top;
        font-size: 14px;
        font-size: .875rem
    }
}

.localNavigation .slider.show {
    transition: all 0.5s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1
}

.localNavigation .slider .hide {
    display: none
}

@media only screen and (min-width: 768px) {
    .localNavigation .slider .hide {
        display:block
    }
}

.localNavigation .slider>li {
    float: left;
    padding: 0 10px;
    white-space: nowrap
}

@media only screen and (min-width: 768px) {
    .localNavigation .slider>li {
        padding:0
    }
}

.localNavigation .slider>li a {
    display: block;
    color: #666;
    padding: 8px 0 7px 0;
    transition: all 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1)
}

@media only screen and (min-width: 768px) {
    .localNavigation .slider>li a {
        padding:12px 20px 10px 20px;
        font-size: 13px;
        font-size: .8125rem;
        line-height: 1.4
    }
}

@media only screen and (min-width: 980px) {
    .localNavigation .slider>li a:hover {
        background:#999;
        color: #fff
    }
}

.localNavigation .slider>li.current a {
    position: relative
}

@media only screen and (max-width: 767px) {
    .localNavigation .slider>li.current a {
        color:#1b76d1
    }
}

@media only screen and (min-width: 768px) {
    .localNavigation .slider>li.current a {
        background:#1b76d1;
        color: #fff
    }
}

.localNavigation .slider>li.current a:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    height: 4px;
    width: 100%;
    background: #1b76d1
}

/* fixedLocalNav --------------------------*/
.fixedLocalNav {
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    font-weight: bold;
    background: #f2f2f2;
    width: 100%;
    font-size: 12px;
    font-size: .75rem;
    overflow: hidden;
    white-space: nowrap;
    height: 36px
}

@media only screen and (min-width: 768px) {
    .fixedLocalNav {
        z-index:1000;
        overflow: visible;
        text-align: center;
        font-size: 14px;
        font-size: .875rem;
        width: 100%;
        padding: 0;
        height: auto;
				border-bottom: 3px solid #1b76d0;
    }
}

.fixedLocalNav .list:after {
    content: "";
    clear: both;
    display: block;
    overflow: hidden
}

@media only screen and (min-width: 768px) {
    .fixedLocalNav .list {
        width:auto;
        display: inline-block;
        vertical-align: top;
        font-size: 14px;
        font-size: .875rem
    }
}

.fixedLocalNav .list .hide {
    display: none
}

@media only screen and (min-width: 768px) {
    .fixedLocalNav .list .hide {
        display:block
    }
}

.fixedLocalNav .list>li {
    float: left;
    padding: 0 10px;
    white-space: nowrap
}

@media only screen and (min-width: 768px) {
    .fixedLocalNav .list>li {
        padding:0;
    letter-spacing: 0.20em;
    }
}

.fixedLocalNav .list>li a {
    display: block;
    color: #666;
    padding: 8px 0 7px 0;
    transition: all 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1)
}

@media only screen and (min-width: 768px) {
    .fixedLocalNav .list>li a {
        padding:12px 20px 10px 20px; お知らせ項目あり
        /*padding:12px 30px 10px 30px; お知らせ項目なし */
        font-size: 13px;
        font-size: .8125rem;
        line-height: 1.4;
				border: none;
    }

		.ghostButton.ghostButton-header>a span {
		    background-image: inherit;
		}
}

@media only screen and (min-width: 980px) {
    .fixedLocalNav .list>li a:hover {
        color: #fff
    }

    .fixedLocalNav .list>li a span,
    .fixedLocalNav .list>li a:hover span {
       padding: 0 0px 0 0;
			 background: none;
    }
}

.fixedLocalNav .list>li.current a {
    position: relative
}

@media only screen and (min-width: 768px) {
    .fixedLocalNav .list>li.current a {
        background:#1b76d1;
        color: #fff
    }
}

.fixedLocalNav .list>li.current a:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    height: 4px;
    width: 100%;
    background: #1b76d1
}


/* --------------------------------------
.pageTopLink
--------------------------------------- */

.pageTopLink {
	/*position: fixed; */*/
	    right: 30px;
	    bottom: 0px;
	    opacity: 0;
	    z-index: -1;
	    transition: all 0.4s 0s ease;
	    /*border: 1px solid #1b76d0;*/
	    overflow: hidden;
	    background: #5496d8;
	    text-align: center;
}

.pageTopLink a {
    position: relative;
    text-indent: -9999px;
    width: 44px;
    width: 100%;
    height: 44px;
    display:block;
    background-size: 16px auto;
    border-radius: 0px;
    z-index: 2;
		/*background: #fff;*/
		margin: 0 auto;
}

.pageTopLink a:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../img/arrow_top_white.svg") no-repeat center center;
    background-size: 14px auto;
    z-index: 2
}

.pageTopLink a:after {
    content: '';
    position: absolute;
    bottom: -100%;
    left: 0;
    width: 100%;
    height: 100%;
    background: #8bbef0;
    transition: all 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
    z-index: 1
}

.pageTopLink a:hover:before {
    background: url("../img/arrow_top_white.svg") no-repeat center center;
    background-size: 14px auto
}

.pageTopLink a:hover:after {
    bottom: 0
}

.pageTopLink.show {
    opacity: 1;
    z-index: 1000
}


@media only screen and (max-width: 767px) {
    .pageTopLink {
        display:block;
		    opacity: 1;
    }
}

/* Small devices: Tablets (≥768px) */
 @media (min-width: 768px) and (max-width: 991px) {
    .pageTopLink {
        display:block;
		    opacity: 1;
    }
 }



/* -------------------------------------------------------
.modalMenu
 sp時のメニュー
------------------------------------------------------- */

.modalMenu {
    display: none;
    z-index: 1000;
    padding: 55px 0;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box
}

@media only screen and (max-width: 767px) {
    .modalMenu {
        font-size:14px;
        font-size: .875rem
    }
}

.modalMenu .overLay {
    opacity: 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    background: rgba(0,0,0,0.8);
    transition: all 0.4s 0s ease
}

.modalMenu .modalMenuInner {
    position: relative;
    z-index: 1000;
    opacity: 0;
    transition: opacity 0.4s 0s ease,-webkit-transform 1s 0s cubic-bezier(0.19, 1, 0.22, 1);
    transition: transform 1s 0s cubic-bezier(0.19, 1, 0.22, 1),opacity 0.4s 0s ease;
    transition: transform 1s 0s cubic-bezier(0.19, 1, 0.22, 1),opacity 0.4s 0s ease,-webkit-transform 1s 0s cubic-bezier(0.19, 1, 0.22, 1);
    -webkit-transform: translateY(-100px);
    transform: translateY(-100px);
    padding: 0 6%
}

.modalMenu .modalNavigation {
    display: block;
    width: 100%;
    box-sizing: border-box;
    float: none;
    margin: 0 0 20px 0;
    font-weight: bold;
    background: #fff
}

.modalMenu .modalNavigation:after {
    content: "";
    clear: both;
    display: block;
    overflow: hidden
}

@media only screen and (max-width: 767px) {
    .modalMenu .modalNavigation>li {
        float:left;
        width: 50%;
        box-sizing: border-box;
        border-bottom: 1px solid #d9d9d9
    }
}

@media only screen and (min-width: 768px) {
    .modalMenu .modalNavigation>li {
        border-top:1px solid #d9d9d9
    }
}

@media only screen and (min-width: 768px) {
    .modalMenu .modalNavigation>li:first-child {
        border-top:none
    }
}

@media only screen and (max-width: 767px) {
    .modalMenu .modalNavigation>li:nth-child(2n+1) {
        border-right:1px solid #d9d9d9
    }
}

@media only screen and (max-width: 767px) {
    .modalMenu .modalNavigation>li:last-child {
        border-bottom:none
    }
}

.modalMenu .modalNavigation>li a {
    position: relative;
    padding: 12px 20px 10px;
    display: block;
    background: #fff
}

.modalMenu .modalNavigation>li a:after {
    content: '';
    position: absolute;
    top: 50%;
    margin: -9px 0 0 0;
    right: 20px;
    display: block;
    width: 9px;
    height: 18px;
    background: url("../img/arrow_right_black.svg") no-repeat 0 0;
    background-size: 9px auto
}

.modalMenu .modalEntryButton {
    display: block;
    box-sizing: border-box;
    width: 100%;
    text-align: center;
    font-weight: bold
}

.modalMenu .modalEntryButton a {
    display: block;
    width: 100%;
    padding: 10px 0;
    border: none;
    background: #1b76d1;
    color: #fff;
    margin-bottom: 5px;
}

.modalMenu .modalEntryButton a span {
    padding: 0 16px 0 0;
    background: url("../img/arrow_right_white_bold.svg") no-repeat 100% 50%;
    background-size: 8px auto
}

.modalMenu.anistart .overLay {
    opacity: 1
}

.modalMenu.anistart .modalMenuInner {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

/* -------------------------------------------------------
ghostButton
------------------------------------------------------- */


.ghostButton {
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro"
}

.ghostButton>a {
    position: relative;
    text-align: center;
    display: block;
    font-weight: bold;
    overflow: hidden;
    transition: all 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
    box-sizing: border-box
}

.ghostButton>a span {
    display: inline-block;
    position: relative;
    padding: 0 14px 0 0;
    z-index: 2
}

.ghostButton>a:after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    display: block;
    width: 100%;
    height: 100%;
    transition: all 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
    z-index: 1
}

@media only screen and (min-width: 980px) {
    .ghostButton>a:hover:after {
        left:0
    }
}

.ghostButton.ghostButton-header {
    float: right;
    font-size: 12px;
    font-size: .75rem;
    margin: 0 0 0 20px
}

@media only screen and (max-width: 767px) {
    .ghostButton.ghostButton-header {
        display:none
    }
}

@media only screen and (min-width: 1024px) {
  .ghostButton.ghostButton-header {
    margin: 0 0 0 9px;
  }
}

.ghostButton.ghostButton-header>a {
    float: left;
    padding: 5px 8px 5px 10px;
    border: 1px solid #1b76d1;
    color: #1b76d1
}

.ghostButton.ghostButton-header>a span {
    padding: 0 10px 0 0;
    background: url("../img/arrow_right_blue.svg") no-repeat 100% 50%;
    background-size: 6px auto
}

.ghostButton.ghostButton-header>a:after {
    background: #1b76d1
}

.ghostButton.ghostButton-header>a:hover {
    color: #fff
}

.ghostButton.ghostButton-header>a:hover span {
    background: url("../img/arrow_right_white.svg") no-repeat 100% 50%;
    background-size: 6px auto
}

.ghostButton.ghostButton-header>a+a {
    margin-left: 10px
}

.ie-all .ghostButton.ghostButton-header a {
    /* padding: 6px 8px 0 10px */
}

.ie-all .ghostButton.ghostButton-header a span {
    background-position: 100% 0.28em;
    background-size: 6px 11px
}

.ie-all .ghostButton.ghostButton-header a:hover span {
    background-position: 100% 0.28em;
    background-size: 6px 11px
}

@media only screen and (min-width: 768px) {
    .ghostButton.ghostButton-contentEntry {
        font-size:20px;
        font-size: 1.25rem
    }
}

.ghostButton.ghostButton-contentEntry>a {
    width: 100%;
    border: 2px solid #fff;
    color: #fff;
}

@media only screen and (max-width: 767px) {
    .ghostButton.ghostButton-contentEntry>a {
        padding:13px 10px;
    }
}

@media only screen and (min-width: 768px) {
    .ghostButton.ghostButton-contentEntry>a {
        padding:16px 20px 14px 20px
    }
}

.ghostButton.ghostButton-contentEntry>a+a {
    margin-top: 20px
}

.ghostButton.ghostButton-contentEntry>a span {
    background: url("../img/arrow_right_white_bold.svg") no-repeat 100% 50%;
    background-size: 9px auto
}

.ghostButton.ghostButton-contentEntry>a:after {
    background: #1c75d2;
}

.work .ghostButton.ghostButton-contentEntry>a:after {
    background: #024b8a;
}

@media only screen and (min-width: 980px) {
    .ghostButton.ghostButton-contentEntry>a:hover {
        color:#fff;
				border: 2px solid #024b8a;
    }
}

@media only screen and (min-width: 980px) {
    .ghostButton.ghostButton-contentEntry>a:hover span {
        background:url("../img/arrow_right_white_bold.svg") no-repeat 100% 50%;
        background-size: 9px auto
    }
}

@media only screen and (min-width: 980px) {
    .ghostButton.ghostButton-contentEntry.ghostButton-small {
        display:table;
        margin: auto
    }
}

@media only screen and (min-width: 980px) {
    .ghostButton.ghostButton-contentEntry.ghostButton-small>a {
        float:left;
        width: 400px;
		    letter-spacing: 0.5em;
    }

    .ghostButton.ghostButton-contentEntry.ghostButton-small>a+a {
        margin-top: 0;
        margin-left: 20px
    }
}

@media only screen and (min-width: 980px) {
    .ghostButton.ghostButton-contentEntry.ghostButton-large>a {
        margin-right:auto;
        margin-left: auto;
        width: 400px
    }
}

.ie-all .ghostButton.ghostButton-contentEntry a {
    padding: 8px 0 0 0
}

.ie-all .ghostButton.ghostButton-contentEntry a span {
    background-position: 100% 0.28em;
    background-size: 9px 16px
}

@media only screen and (min-width: 980px) {
    .ie-all .ghostButton.ghostButton-contentEntry a:hover span {
        background-position:100% 0.28em;
        background-size: 9px 16px
    }
}

@media only screen and (min-width: 768px) {
    .ghostButton.ghostButton-guidelineEntry {
        font-size:16px;
        font-size: 1rem
    }
}

.ghostButton.ghostButton-guidelineEntry>a {
    color: #1b76d1;
    border: 1px solid #1b76d1;
    display: block;
    padding: 9px 15px 7px 15px;
    margin: auto
}

@media only screen and (min-width: 768px) {
    .ghostButton.ghostButton-guidelineEntry>a {
        width:400px
    }
}

.ghostButton.ghostButton-guidelineEntry>a span {
    padding: 2px 18px 0 0;
    background: url("../img/arrow_right_blue.svg") no-repeat 100% 50%;
    background-size: 6px auto
}

.ghostButton.ghostButton-guidelineEntry>a:after {
    background: #1b76d1
}

@media only screen and (min-width: 980px) {
    .ghostButton.ghostButton-guidelineEntry>a:hover {
        color:#fff
    }
}

@media only screen and (min-width: 980px) {
    .ghostButton.ghostButton-guidelineEntry>a:hover span {
        background:url("../img/arrow_right_white.svg") no-repeat 100% 50%;
        background-size: 6px auto
    }
}

.ie-all .ghostButton.ghostButton-guidelineEntry a {
    padding: 11px 15px 5px 15px
}

.ie-all .ghostButton.ghostButton-guidelineEntry a span {
    line-height: 1.25;
    background-position: 100% .18em;
    background-size: 6px 11px
}

@media only screen and (min-width: 980px) {
    .ie-all .ghostButton.ghostButton-guidelineEntry a:hover span {
        background-position:100% .18em;
        background-size: 6px 11px
    }
}

@media only screen and (min-width: 768px) {
    .ghostButton.ghostButton-pageNavigation {
        font-size:16px;
        font-size: 1rem
    }
}

@media only screen and (max-width: 767px) {
    .ghostButton.ghostButton-pageNavigation>a {
        text-align:left
    }
}

@media only screen and (min-width: 768px) {
    .ghostButton.ghostButton-pageNavigation>a {
        color:#262626;
        border: 1px solid #262626;
        display: block;
        padding: 9px 15px 7px 15px;
        width: 400px;
        margin: auto;
        box-sizing: border-box
    }
}

@media only screen and (min-width: 768px) {
    .ghostButton.ghostButton-pageNavigation>a span {
        display:inline-block;
        padding: 2px 15px 0 0;
        background: url("../img/arrow_right_black.svg") no-repeat 100% 50%;
        background-size: 6px auto
    }
}

.ghostButton.ghostButton-pageNavigation>a:after {
    background: #262626
}

@media only screen and (min-width: 980px) {
    .ghostButton.ghostButton-pageNavigation>a:hover {
        color:#fff
    }
}

@media only screen and (min-width: 980px) {
    .ghostButton.ghostButton-pageNavigation>a:hover span {
        background:url("../img/arrow_right_white.svg") no-repeat 100% 50%;
        background-size: 6px auto
    }
}

@media only screen and (min-width: 768px) {
    .ie-all .ghostButton.ghostButton-pageNavigation a {
        padding:11px 0 5px 0
    }
}

.ie-all .ghostButton.ghostButton-pageNavigation a span {
    line-height: 1.25;
    background-position: 100% 0.18em;
    background-size: 6px 11px
}

@media only screen and (min-width: 980px) {
    .ie-all .ghostButton.ghostButton-pageNavigation a:hover span {
        background-position:100% 0.18em;
        background-size: 6px 11px
    }
}

.ghostButton.ghostButton-contact>a {
    margin: auto;
    border: 2px solid #fff;
    color: #fff
}

@media only screen and (max-width: 767px) {
    .ghostButton.ghostButton-contact>a {
        padding:8px 0
    }
}

@media only screen and (min-width: 768px) {
    .ghostButton.ghostButton-contact>a {
        width:320px;
        padding: 10px 15px
    }
}

.ghostButton.ghostButton-contact>a span {
    background: url("../img/arrow_right_white_bold.svg") no-repeat 100% 50%;
    background-size: 9px auto
}

.ghostButton.ghostButton-contact>a:after {
    background: #fff
}

@media only screen and (min-width: 980px) {
    .ghostButton.ghostButton-contact>a:hover {
        color:#1b76d1
    }
}

@media only screen and (min-width: 980px) {
    .ghostButton.ghostButton-contact>a:hover span {
        background:url("../img/arrow_right_blue_bold.svg") no-repeat 100% 50%;
        background-size: 9px auto
    }
}

.inactive .ghostButton.ghostButton-contact {
    opacity: .2;
    filter: alpha(opacity=20)
}

.inactive .ghostButton.ghostButton-contact>a:hover {
    cursor: default
}

@media only screen and (min-width: 980px) {
    .inactive .ghostButton.ghostButton-contact>a:hover {
        color:#fff
    }
}

@media only screen and (min-width: 980px) {
    .inactive .ghostButton.ghostButton-contact>a:hover span {
        background:url("../img/arrow_right_white_bold.svg") no-repeat 100% 50%;
        background-size: 9px auto
    }
}

.inactive .ghostButton.ghostButton-contact>a:hover:after {
    left: -100%
}

@media only screen and (min-width: 768px) {
    .ie-all .ghostButton.ghostButton-contact>a {
        padding:14px 15px 6px 15px
    }
}

@media only screen and (min-width: 768px) {
    .ie-all .ghostButton.ghostButton-contact>a span {
        background-position:100% .25em
    }
}

@media only screen and (min-width: 980px) {
    .ie-all .ghostButton.ghostButton-contact>a:hover span {
        background-position:100% .25em
    }
}

/* -------------------------------------------------------
#sentenceHeadding
------------------------------------------------------- */

.sentenceHeadding01 {
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    line-height: 1.6
}

@media only screen and (max-width: 767px) {
    .sentenceHeadding01 {
        font-size:18px;
        font-size: 1.125rem;
        margin: 0 0 18px
    }
}

@media only screen and (min-width: 768px) {
    .sentenceHeadding01 {
        font-size:28px;
        font-size: 1.75rem;
        margin: 0 0 40px 0
    }
}

.sentenceHeadding01 .hide {
    display: none
}

@media only screen and (min-width: 768px) {
    .sentenceHeadding01 .hide {
        display:block
    }
}

.sentenceHeadding02 {
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro"
}

@media only screen and (max-width: 767px) {
    .sentenceHeadding02 {
        margin:0 0 6px 0
    }
}

@media only screen and (min-width: 768px) {
    .sentenceHeadding02 {
        line-height:1.25;
        font-size: 20px;
        font-size: 1.25rem;
        margin: 0 0 22px 0
    }
}

@media only screen and (max-width: 767px) {
    .sentenceText {
        margin:0 0 6px 0;
        line-height: 1.75
    }
}

@media only screen and (min-width: 768px) {
    .sentenceText {
        margin:0 0 20px 0;
        line-height: 2
    }
}


.sentenceText.text-right {
	text-align: right;
	font-weight: bold;
}

@media only screen and (max-width: 767px) {
    .sentenceImg {
        margin:0 0 6px 0
    }
}

@media only screen and (min-width: 768px) {
    .sentenceImg {
        margin:0 0 20px 0
    }
}

.sentenceImg img {
    width: 100%;
    height: auto
}

.sentenceList {
    margin: 0 0 20px 0
}

.sentenceList li {
    margin: 0 0 4px 0
}

.sentenceList.sentenceList-disc>li {
    padding: 0 0 0 14px;
    background: url("../img/icon_list-style_disc_gray.svg") no-repeat 0 0.6em
}

.sentenceList.sentenceList-link>li {
    padding: 0 0 0 14px;
    background: url("../img/arrow_right_black.svg") no-repeat 0 .45em;
    background-size: 6px auto
}

.sentenceList.sentenceList-child {
    margin: 0
}

.sentenceList.sentenceList-child>li {
    margin: 0
}

.sentenceTable {
    width: 100%;
    table-layout: fixed;
    font-size: 14px;
    font-size: .875rem
}

@media only screen and (max-width: 767px) {
    .sentenceTable {
        margin:0 0 6px 0;
        border-bottom: 1px solid #d9d9d9;
        font-size: 14px;
        font-size: .875rem
    }
}

@media only screen and (min-width: 768px) {
    .sentenceTable {
        margin:0 0 20px 0
    }
}

@media only screen and (max-width: 767px) {
    .sentenceHeadding02+.sentenceTable {
        margin:0 0 6px 0
    }
}

@media only screen and (min-width: 768px) {
    .sentenceHeadding02+.sentenceTable {
        margin:26px 0 20px 0
    }
}

@media only screen and (max-width: 767px) {
    .sentenceTable tr {
        display:block;
        padding: 14px 0 10px 0;
        border-top: 1px solid #d9d9d9
    }
}

@media only screen and (max-width: 767px) {
    .sentenceTable th {
        display:block;
        line-height: 1.25
    }
}

@media only screen and (min-width: 768px) {
    .sentenceTable th {
        padding:10px 0;
        width: 20%;
        border-top: 1px solid #d9d9d9;
        border-bottom: 1px solid #d9d9d9;
        word-break: break-all
    }
}

@media only screen and (max-width: 767px) {
    .sentenceTable th .hide {
        display:none
    }
}

@media only screen and (max-width: 767px) {
    .sentenceTable td {
        display:block
    }
}

@media only screen and (min-width: 768px) {
    .sentenceTable td {
        padding:10px 0 10px 20px;
        width: 80%;
        border-top: 1px solid #d9d9d9;
        border-bottom: 1px solid #d9d9d9
    }
}

@media only screen and (min-width: 768px) {
    .sentenceTable td .hide {
        display:none
    }
}

/* -------------------------------------------------------
#message/interview.html
	.profileBlock
------------------------------------------------------- */

.profileBlock {
    border: 1px solid #ccc;
    font-size: 14px;
    font-size: .875rem
}

@media only screen and (max-width: 767px) {
    .profileBlock {
        padding:15px 20px;
        margin: 20px 0 0 0
    }
}

@media only screen and (min-width: 768px) {
    .profileBlock {
        padding:25px 30px;
        margin: 48px 0 0 0
    }
}

.profileBlock dt {
    font-weight: bold;
    margin: 0 0 5px 0
}

/* -------------------------------------------------------
#guideline/
	.guidelineEntryHeading
------------------------------------------------------- */

.guidelineEntryHeading {
    text-align: center;
    font-weight: bold;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    margin: 0 0 18px 0
}

@media only screen and (max-width: 767px) {
    .guidelineEntryHeading {
        font-size:16px;
        font-size: 1rem
    }
}

@media only screen and (min-width: 768px) {
    .guidelineEntryHeading {
        font-size:18px;
        font-size: 1.125rem
    }
}

@media only screen and (min-width: 768px) {
    .guidelineEntryHeading .hide {
        display:none
    }
}


/* -------------------------------------------------------
#contact系
------------------------------------------------------- */

.contactHeader {
    box-shadow: 0px 4px 2px -2px rgba(0,0,0,0.1);
    padding: 0 0 12px 0
}

@media only screen and (min-width: 980px) {
    .contactHeader {
        height:70px;
        padding: 0
    }
}

.contactHeader .inner {
    padding: 0 6%
}

.contactHeader .inner:after {
    content: "";
    clear: both;
    display: block;
    overflow: hidden
}

@media only screen and (min-width: 980px) {
    .contactHeader .inner {
        width:700px;
        margin: auto;
        padding: 16px 0
    }
}

.contactContentsArea {
    padding: 30px 0 0 0
}

@media only screen and (min-width: 768px) {
    .contactContentsArea {
        width:700px;
        margin: auto;
        padding: 60px 0 0 0
    }
}

.contactPageTitle {
    font-weight: bold;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro"
}

@media only screen and (max-width: 767px) {
    .contactPageTitle {
        font-weight:bold;
        font-size: 18px;
        font-size: 1.125rem;
        margin: 0 6% 20px 6%
    }
}

@media only screen and (min-width: 768px) {
    .contactPageTitle {
        font-size:32px;
        font-size: 2rem;
        margin: 0 0 45px 0
    }
}

@media only screen and (max-width: 767px) {
    .contactLeadText {
        margin:0 6% 40px 6%
    }
}

@media only screen and (min-width: 768px) {
    .contactLeadText {
        margin:0 0 50px 0
    }
}

.contactBlock {
    margin: 0 0 50px 0
}

@media only screen and (max-width: 767px) {
    .contactBlock {
        margin:0 6% 50px 6%
    }
}

.contactRequired {
    display: inline-block;
    padding: 1px 5px;
    color: #fff;
    background: #c70007;
    font-size: 11px;
    font-size: .6875rem
}

.contactRequired.contactRequired-leadText {
    margin: 0 5px 0 0;
    vertical-align: middle
}

.contactRequired.contactRequired-input {
    margin: 0 0 0 15px;
    vertical-align: middle
}

.errorMessage {
    display: none;
    font-weight: normal;
    color: #e60000;
    font-size: 14px;
    font-size: .875rem;
    font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    padding: 0 0 0 14px;
    margin: 0 0 0 15px;
    background: url("../../entry/img/icon_caution.svg") no-repeat 0 center
}

.inputItemBlock-error .errorMessage {
    display: inline-block
}

.iconComplete {
    display: none;
    vertical-align: middle;
    margin: 0 0 0 15px
}

.inputItemBlock-complete .iconComplete {
    display: inline-block
}

.iconComplete img {
    display: block
}

.contactHedding01 {
    font-weight: bold;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro"
}

@media only screen and (max-width: 767px) {
    .contactHedding01 {
        font-size:18px;
        font-size: 1.125rem;
        margin: 0 0 18px
    }
}

@media only screen and (min-width: 768px) {
    .contactHedding01 {
        font-size:28px;
        font-size: 1.75rem;
        margin: 0 0 25px 0
    }
}

.contactHedding02 {
    font-weight: bold;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro"
}

@media only screen and (max-width: 767px) {
    .contactHedding02 {
        margin:0 0 5px 0
    }
}

@media only screen and (min-width: 768px) {
    .contactHedding02 {
        font-size:20px;
        font-size: 1.25rem;
        margin: 0 0 10px 0
    }
}

.contactHedding03 {
    padding: 0 0 8px 0;
    font-size: 14px;
    font-size: .875rem
}

.inputItemBlock {
    margin: 0 0 40px 0
}

@media only screen and (max-width: 767px) {
    .inputGenderList>li {
        float:left;
        margin: 0 20px 0 0
    }
}

@media only screen and (max-width: 767px) {
    .inputExperienceList>li {
        float:left;
        margin: 0 20px 0 0
    }
}

@media only screen and (min-width: 768px) {
    .inputLocationList>li {
        float:left;
        width: 50%;
        margin: 0
    }
}

.inputLocationList>li:nth-child(even) {
    padding: 0
}

@media only screen and (min-width: 768px) {
    .inputJobsList>li {
        float:left;
        width: 50%;
        margin: 0
    }
}

.inputJobsList>li:nth-child(even) {
    padding: 0
}

.inputText {
    background: #f2f2f2;
    border: 1px solid #ccc;
    padding: 10px;
    box-sizing: border-box;
    transition: all 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
    width: 100%;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    -webkit-tap-highlight-color: transparent
}

@media only screen and (min-width: 768px) {
    .inputText:hover {
        background:#fff
    }
}

.inputText:focus {
    background: #fff
}

.inputItemBlock-error .inputText {
    background: #fae1e1;
    border: 1px solid #f5aeae
}

.inputItemBlock-error .inputText:focus {
    background: #fff;
    border: 1px solid #ccc
}

.inputItemBlock-complete .inputText {
    background: #fff
}

@media only screen and (min-width: 768px) {
    .inputAddressBlock-code .inputText {
        float:left;
        width: 200px
    }
}

.textarea {
    background: #f2f2f2;
    border: 1px solid #ccc;
    padding: 10px;
    box-sizing: border-box;
    transition: all 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
    width: 100%;
    height: 300px;
    box-sizing: border-box;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    -webkit-tap-highlight-color: transparent
}

@media only screen and (min-width: 768px) {
    .textarea:hover {
        background:#fff
    }
}

.textarea:focus {
    background: #fff
}

.inputItemBlock-error .textarea {
    background: #fae1e1;
    border: 1px solid #f5aeae
}

.inputItemBlock-error .textarea:focus {
    background: #fff;
    border: 1px solid #ccc
}

.inputItemBlock-complete .textarea {
    background: #fff
}

.selectText {
    cursor: pointer;
    display: block;
    position: relative;
    background: #f2f2f2;
    border: 1px solid #D0D0D0;
    width: 100%
}

@media only screen and (min-width: 768px) {
    .selectText:hover {
        background:#fff
    }
}

.selectText:focus {
    background: #fff
}

.inputItemBlock-error .selectText {
    background: #fae1e1;
    border: 1px solid #f5aeae
}

.inputItemBlock-error .selectText:focus {
    background: #fff;
    border: 1px solid #ccc
}

.inputItemBlock-complete .selectText {
    background: #fff
}

.selectText:after {
    position: absolute;
    content: "";
    top: 50%;
    right: 15px;
    margin: -2px 0 0 0;
    border-top: 5px solid #000000;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent
}

.selectText .select {
    position: relative;
    z-index: 1;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
    width: 100%;
    padding: 7px 14px;
    background: transparent;
    font-size: 16px;
    font-size: 1rem;
    font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    line-height: 1.5;
    border: none
}

.inputAddressBlock {
    margin: 0 0 20px 0
}

.postalCodeModal .inputAddressBlock:last-child {
    margin: 0
}

@media only screen and (min-width: 768px) {
    .addressBlock {
        display:table;
        width: 100%;
        margin: 0 0 20px 0
    }
}

@media only screen and (min-width: 768px) {
    .addressBlock .inputAddressBlock {
        display:table-cell;
        vertical-align: middle;
        margin: 0
    }
}

.addressBlock .inputAddressBlock.inputAddressBlock-code {
    width: 100%
}

@media only screen and (min-width: 768px) {
    .addressBlock .inputAddressBlock.inputAddressBlock-code {
        width:200px
    }
}

.addressBlock .inputAddressBlock.inputAddressBlock-state {
    width: 100%
}

@media only screen and (min-width: 768px) {
    .addressBlock .inputAddressBlock.inputAddressBlock-state {
        padding:0 10px 0 0;
        width: 50%
    }
}

.addressBlock .inputAddressBlock.inputAddressBlock-city {
    width: 100%
}

@media only screen and (min-width: 768px) {
    .addressBlock .inputAddressBlock.inputAddressBlock-city {
        padding:0 0 0 10px;
        width: 50%;
        box-sizing: border-box
    }
}

.addressBlock .inputAddressBlock.inputAddressBlock-line01 {
    width: 100%
}

@media only screen and (min-width: 768px) {
    .addressBlock .inputAddressBlock.inputAddressBlock-line01 {
        padding:0 10px 0 0;
        width: 50%
    }
}

.addressBlock .inputAddressBlock.inputAddressBlock-line02 {
    width: 100%
}

@media only screen and (min-width: 768px) {
    .addressBlock .inputAddressBlock.inputAddressBlock-line02 {
        padding:0 0 0 10px;
        width: 50%
    }
}

.addressBlock .postalCodeLink {
    padding: 0 0 0 12px;
    font-size: 14px;
    font-size: .875rem;
    background: url("../img/arrow_right_black.svg") no-repeat 0 50%;
    background-size: 4px auto
}

@media only screen and (min-width: 768px) {
    .addressBlock .postalCodeLink {
        float:left;
        display: block;
        margin: 8px 0 0 20px
    }
}

.returnLink {
    margin: 0 0 40px 0
}

@media only screen and (max-width: 767px) {
    .returnLink {
        margin:0 6% 40px 6%
    }
}

.returnLink a {
    padding: 0 0 0 12px;
    font-size: 14px;
    font-size: .875rem;
    display: inline-block;
    line-height: 1.25;
    background: url("../img/arrow_left_black.svg") no-repeat 0 50%;
    background-size: 6px auto
}

.ie-all .returnLink a {
    background-position: 0 .15em
}

@media only screen and (min-width: 768px) {
    .returnLink a:hover {
        color:#1b76d1;
        background: url("../img/arrow_left_blue.svg") no-repeat 0 50%;
        background-size: 6px auto
    }
}

@media only screen and (min-width: 768px) {
    .ie-all .returnLink a:hover {
        background-position:0 .15em
    }
}

@media only screen and (min-width: 768px) {
    .returnLink.returnLink-complete {
        margin:0 0 115px 0
    }
}

.contactCompleteMessage {
    background: #1b76d1;
    color: #fff;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    text-align: center;
    font-weight: bold;
    padding: 35px 6%;
    margin: 0 0 18px
}

@media only screen and (min-width: 768px) {
    .contactCompleteMessage {
        padding:35px 0;
        font-size: 20px;
        font-size: 1.25rem;
        margin: 0 0 35px 0
    }
}

.contactCompleteTextArea {
    margin: 0 0 25px 0
}

@media only screen and (max-width: 767px) {
    .contactCompleteTextArea {
        margin:0 6% 25px 6%
    }
}

.contactCompleteTextArea>p {
    margin: 0 0 10px 0
}

.contactButtonArea {
    background: #1b76d1;
    text-align: center;
    color: #fff
}

@media only screen and (max-width: 767px) {
    .contactButtonArea {
        padding:45px 6%
    }
}

@media only screen and (min-width: 768px) {
    .contactButtonArea {
        padding:50px
    }
}

.contactButtonArea.contactButtonArea-input {
    margin: 0 0 60px 0
}

.contactButtonArea.contactButtonArea-confirm {
    margin: 0 0 40px 0
}

.contactButtonArea .text {
    font-size: 14px;
    font-size: .875rem;
    font-weight: bold;
    margin: 0 0 12px 0
}

.contactButtonArea .text a {
    color: #fff;
    background: url("../img/icon_blank_white.svg") no-repeat 7px 0.4em/9px 7px;
    padding: 0 0 0 20px;
    text-decoration: underline
}

@media only screen and (max-width: 568px) {
    .contactButtonArea .text a {
        background-position:7px .2em
    }
}

.contactButtonArea .text span {
    color: #c70007;
}

.contactButtonArea .checkbox {
    font-size: 14px;
    font-size: .875rem;
    margin: 0 0 14px 0
}

.contactButtonArea .checkbox input {
    display: none
}

.contactButtonArea .checkbox input:checked+label {
    color: #fff
}

.contactButtonArea .checkbox input:checked+label:before {
    color: #fff
}

.contactButtonArea .checkbox input:checked+label:after {
    color: #fff;
    -webkit-transform: translateY(-50%) rotate(45deg);
    transform: translateY(-50%) rotate(45deg)
}

.contactButtonArea .checkbox label {
    display: inline-block;
    cursor: pointer;
    position: relative;
    padding: 0 0 0 26px
}

.contactButtonArea .checkbox label:before {
    content: "";
    position: absolute;
    left: 0;
    width: 18px;
    height: 18px;
    border: 2px solid currentColor;
    box-sizing: border-box;
    transition: all 0.2s ease;
    top: 4px
}

.contactButtonArea .checkbox label:after {
    content: "";
    position: absolute;
    display: block;
    color: transparent;
    transition: all 0.2s ease;
    top: 12px;
    width: 3px;
    height: 7px;
    left: 6px;
    border: solid 3px currentColor;
    border-left: 0;
    border-top: 0;
    -webkit-transform: translateY(-40%) rotate(30deg);
    transform: translateY(-40%) rotate(30deg)
}

.inputRadioList {
    margin: 0 0 -5px 0
}

.inputRadioList:after {
    content: "";
    clear: both;
    display: block;
    overflow: hidden
}

.inputRadioList>li {
    box-sizing: border-box
}

@media only screen and (min-width: 768px) {
    .inputRadioList>li {
        margin:0 0 5px 0;
        padding: 0 35px 0 0;
        float: left
    }
}

.inputRadioList>li input {
    display: none
}

.inputRadioList>li input:checked+label {
    color: #1b76d1
}

.inputRadioList>li input:checked+label:before {
    color: #1b76d1
}

.inputRadioList>li input:checked+label:after {
    color: #1b76d1
}

.inputRadioList>li label {
    display: inline-block;
    cursor: pointer;
    position: relative;
    padding: 0 0 0 26px
}

.inputRadioList>li label:before {
    content: "";
    position: absolute;
    left: 0;
    width: 18px;
    height: 18px;
    background: #fff;
    border: 2px solid currentColor;
    box-sizing: border-box;
    color: #D0D0D0;
    transition: all 0.2s ease;
    border-radius: 50%;
    top: 4px
}

.inputRadioList>li label:after {
    content: "";
    position: absolute;
    display: block;
    color: transparent;
    transition: all 0.2s ease;
    left: 4px;
    width: 10px;
    height: 10px;
    background: currentColor;
    border-radius: 50%;
    box-sizing: border-box;
    top: 8px
}

/* -------------------------------------------------------
#js-系
------------------------------------------------------- */


.postalCodeModal {
    display: none;
    position: absolute;
    top: 1500px;
    right: 0;
    left: 0;
    width: 88%;
    margin: auto;
    z-index: 1000
}

@media only screen and (min-width: 768px) {
    .postalCodeModal {
        width:700px
    }
}

.postalCodeModal.show {
    opacity: 1;
    z-index: 1000
}

.modalBlock {
    background: #fff
}

@media only screen and (max-width: 767px) {
    .modalBlock {
        padding:20px
    }
}

@media only screen and (min-width: 768px) {
    .modalBlock {
        padding:40px
    }
}

.modalButtonArea {
    padding: 20px;
    background: #f2f2f2
}

.modalClose {
    position: absolute;
    cursor: pointer;
    background-image: url("../img/icon_close_black.svg");
    background-position: 0 50%;
    background-size: 14px;
    background-repeat: no-repeat;
    color: #000
}

@media only screen and (max-width: 767px) {
    .modalClose {
        top:20px;
        right: 20px;
        padding: 0 0 0 15px;
        font-size: 14px;
        font-size: .875rem;
        background-size: 12px
    }
}

@media only screen and (min-width: 768px) {
    .modalClose {
        top:40px;
        right: 40px;
        padding: 0 0 0 20px
    }
}

@media only screen and (min-width: 768px) {
    .modalClose:hover {
        background-image:url("../img/icon_close_blue.svg");
        color: #1b76d1
    }
}

.postalCodeModalBg {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 500;
    height: 100%;
    width: 100%;
    background: #000;
    opacity: .5;
    filter: alpha(opacity=50)
}


/* #contact系
------------------------------------------- */

.requiredCounter {
    position: fixed;
    min-width: 120px;
    box-sizing: border-box;
    z-index: 2000;
    font-size: 14px;
    font-size: .875rem;
    text-align: center;
    font-weight: bold;
    top: 0;
    left: 0;
    width: 100%;
    margin: 0;
    padding: 5px 0;
    color: #fff;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    transition: -webkit-transform 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: transform 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: transform 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1)
}

@media only screen and (min-width: 980px) {
    .requiredCounter {
        -webkit-transform:none;
        transform: none;
        width: auto;
        background: #f2f2f2;
        top: 130px;
        left: auto;
        margin: 0 0 0 730px;
        padding: 20px 20px 15px 20px;
        color: #333;
        white-space: nowrap
    }
}

.requiredCounter:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    background: #4d4741;
    opacity: 0.8
}

@media only screen and (min-width: 980px) {
    .requiredCounter:before {
        background:none;
        width: auto;
        height: auto;
        opacity: 1;
        top: 50%;
        left: -10px;
        margin: -3px 0 0 0;
        border-right: 10px solid transparent;
        border-bottom: 10px solid #f2f2f2;
        border-left: 10px solid transparent
    }
}

.requiredCounter.show {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.requiredCounter br {
    display: none
}

@media only screen and (min-width: 980px) {
    .requiredCounter br {
        display:block
    }
}

.requiredCounter .text {
    position: relative;
    z-index: 1000;
    line-height: 1.5
}

.requiredCounter .number {
    font-size: 18px;
    font-size: 1.125rem;
    font-weight: bold
}

@media only screen and (min-width: 980px) {
    .requiredCounter .number {
        color:#1b76d1
    }
}

input[type="number"]::-webkit-outer-spin-button,input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type="number"] {
    -moz-appearance: textfield
}

/* -------------------------------------------------------
.pageTitleArea
------------------------------------------------------- */


.pageTitleArea {
    position: relative;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    box-sizing: border-box
}

@media only screen and (max-width: 767px) {
    .pageTitleArea {
        text-align:center
    }
}

@media only screen and (min-width: 768px) {
    .pageTitleArea {
        height:400px;
        /* padding:50px 0 100px 0; */
        padding:60px 0 100px 0;
    }
}


/* Small devices: Tablets (≥768px) */
@media (min-width: 768px) and (max-width: 991px) {
	.pageTitleArea {
	    height: 303px;
	    padding: 20px 0 100px 0;
	}
}

.pageTitleArea.pageTitleArea-feature {
    background: url("../../about/img/img_title-area-feature.jpg") no-repeat center 0
}

@media only screen and (max-width: 767px) {
    .pageTitleArea.pageTitleArea-feature {
        background-size:cover;
        background-position: left 0
    }
}

.pageTitleArea.pageTitleArea-brand {
    background: url("../../about/img/img_title-area-brand.jpg") no-repeat center 0
}

@media only screen and (max-width: 767px) {
    .pageTitleArea.pageTitleArea-brand {
        background-size:cover
    }
}

.pageTitleArea.pageTitleArea-merit {
    background: url("../../about/img/img_title-area-merit.jpg") no-repeat center 0
}

@media only screen and (max-width: 767px) {
    .pageTitleArea.pageTitleArea-merit {
        background-size:cover
    }
}

.pageTitleArea.pageTitleArea-jobs {
    background: url("../../about/img/img_title-area-jobs.jpg") no-repeat center 0
}

@media only screen and (max-width: 767px) {
    .pageTitleArea.pageTitleArea-jobs {
        background-size:cover;
        background-position: right 0
    }
}

.pageTitleArea.pageTitleArea-gallery {
    background: url("../../about/img/img_title-area-gallery.jpg") no-repeat center 0
}

@media only screen and (max-width: 767px) {
    .pageTitleArea.pageTitleArea-gallery {
        background-size:cover
    }
}

.pageTitleArea.pageTitleArea-state {
    background: url("../../vision/img/img_title-area-state.jpg") no-repeat center 0
}

@media only screen and (max-width: 767px) {
    .pageTitleArea.pageTitleArea-state {
        background-size:cover
    }
}

.pageTitleArea.pageTitleArea-future {
    background: url("../../vision/img/img_title-area-future.jpg") no-repeat center 0
}

@media only screen and (max-width: 767px) {
    .pageTitleArea.pageTitleArea-future {
        background-size:cover
    }
}

.pageTitleArea.pageTitleArea-applicant {
    background: url("../../message/img/img_title-area-applicant.jpg") no-repeat center 0
}

@media only screen and (max-width: 767px) {
    .pageTitleArea.pageTitleArea-applicant {
        background-size:cover;
        background-position: left 0;

    }

    .sub .pageTitleArea.pageTitleArea-applicant {
	    margin-top: 50px!important;
	    padding: 22px 0px 18px;
		}
}


.pageTitleArea.pageTitleArea-interview {
    background: url("../../message/img/img_title-area-interview.jpg") no-repeat center 0
}

@media only screen and (max-width: 767px) {
    .pageTitleArea.pageTitleArea-interview {
        background-size:cover
    }
}

.pageTitleArea.pageTitleArea-guideline {
    background: url("../../guideline/img/img_title-area-guideline.jpg") no-repeat center 0
}

@media only screen and (max-width: 767px) {
    .pageTitleArea.pageTitleArea-guideline {
        background-size:cover
    }
}

@media only screen and (max-width: 767px) {
    .pageTitleArea .inner {
		/* padding: 30px 0; */
		padding: 35px 0 15px;
    width: 90%;
    margin: 0 auto;
    box-sizing: border-box;
    background: rgba(0, 0, 0, 0.25);
    }
}

@media only screen and (min-width: 768px) {
    .pageTitleArea .inner {
        padding:0 6%
    }
}

/* Small devices: Tablets (≥768px) */
 @media (min-width: 768px) and (max-width: 991px) {
	 .pageTitleArea.pageTitleArea-applicant {

	 }

    .pageTitleArea .inner {
			width:480px;
			height: 197px;
			margin:0px auto;
			background:rgba(0, 0, 0, 0.25);
			padding-top:30px;
			padding-bottom:30px;
			/* padding: 35px 0 35px 10px; */
			padding: 40px 0 15px 10px;
    }
 }

@media only screen and (min-width: 980px) {
    .pageTitleArea .inner {
			width:480px;
			height: 207px;
			margin:0px auto;
			background:rgba(0, 0, 0, 0.25);
			padding-top:35px;
			padding-bottom:30px;
			padding: 60px 0 15px 0px;
    }
}

.pageTitleArea .categryTitle {
    position: relative;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    color: #fff;
    line-height: 1.25;
    font-weight: bold;
		text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.99);
}

@media only screen and (max-width: 767px) {
    .pageTitleArea .categryTitle {
        font-size:12px;
        font-size: .75rem;
        margin: 0 0 10px 0
    }
}

@media only screen and (min-width: 768px) {
    .pageTitleArea .categryTitle {
        text-align:center;
        font-size: 16px;
        font-size: 1rem;
        margin: 0 0 25px 0;
    }
}

.pageTitleArea .categryTitle span {
    position: relative
}

@media only screen and (max-width: 767px) {
    .pageTitleArea .categryTitle span {
        padding:0 23px;
        font-size: 1.3em;
    }
}

@media only screen and (min-width: 768px) {
    .pageTitleArea .categryTitle span {
        padding:0 40px;
				font-weight: 100;
    }
}

.pageTitleArea .categryTitle span:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    display: inline-block;
    width: 20px;
    height: 1px;
    background: #fff;
		text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.99);
}

@media only screen and (max-width: 767px) {
    .pageTitleArea .categryTitle span:before {
        background:#fff;
				width: 15px;
    }
}

.pageTitleArea .categryTitle span:after {
    content: '';
    position: absolute;
    top: 50%;
    right: 0;
    display: inline-block;
    width: 20px;
    height: 1px;
    background: #fff;
		text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.99);
}

@media only screen and (max-width: 767px) {
    .pageTitleArea .categryTitle span:after {
        background:#fff;
				width: 15px;
    }
}

.pageTitleArea .pageTitle {
    color: #fff;
		text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.99);
}

@media only screen and (max-width: 767px) {
    .pageTitleArea .pageTitle {
        font-size:18px;
        font-size: 1.625rem;
        margin: 0 0 5px 0;
    }
}

@media only screen and (min-width: 768px) {
    .pageTitleArea .pageTitle {
        font-size:32px;
        font-size: 2rem;
        text-align: center;
        margin: 0 0 20px 0;
    }
}

.pageTitleArea .pageTitle .hide {
    display: none
}

@media only screen and (max-width: 568px) {
    .pageTitleArea .pageTitle .hide {
        display:block
    }
}

.pageTitleArea .leadText {
    color: #fff;
		text-shadow: 0px 0px 1px rgba(0, 0, 0, 0.99);
}

@media only screen and (max-width: 767px) {
    .pageTitleArea .leadText {
        font-size:14px;
        font-size: .875rem;
        line-height: 1.5;
				font-weight: bold;
    }
}

/* Extra small devices: Phone iphone3,4,5 */
@media (min-width: 320px) and (max-width:374px){
  .pageTitleArea .leadText{
    font-size: .775rem;
  }
}

@media only screen and (min-width: 768px) {
    .pageTitleArea .leadText {
        text-align:center;
        font-weight: bold;
        font-size: 16px;
        font-size: 1rem;
		    padding-left: 1em;
    }
}

.pageTitleArea .leadText .hide {
    display: none
}

@media only screen and (max-width: 568px) {
    .pageTitleArea .leadText .hide {
        display:block
    }
}

.pagingNavigation {
    border-top: 1px solid #d9d9d9
}

@media only screen and (max-width: 767px) {
    .pagingNavigation {
        padding:0 6%
    }
}

@media only screen and (min-width: 768px) {
    .pagingNavigation {
        padding:0 6%;
        margin: 0 0 80px 0
    }
}

@media only screen and (max-width: 767px) {
    .pagingNavigation .inner {
        padding:12px 0;
        background: url("../img/arrow_right_black.svg") no-repeat 100% 50%;
        background-size: 9px auto
    }
}

@media only screen and (min-width: 768px) {
    .pagingNavigation .inner {
        padding:55px 0 0 0;
        text-align: center
    }
}

@media only screen and (min-width: 980px) {
    .pagingNavigation .inner {
        width:800px;
        margin: 0 auto
    }
}

.pagingNavigation .inner .hedding {
    color: #1b76d1;
    font-weight: bold;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    font-size: 18px;
    font-size: 1.125rem;
    margin: 0 0 6px 0
}

@media only screen and (max-width: 767px) {
    .pagingNavigation .inner .hedding {
        font-size:12px;
        font-size: .75rem
    }
}

.pagingNavigation .inner .text {
    margin: 0 0 18px 0
}

@media only screen and (max-width: 767px) {
    .pagingNavigation .inner .text {
        display:none
    }
}

/* -------------------------------------------------------
.lowerPhotoArea 募集要項
.loweTextArea エントリーフォーム
	各ページの下部にある、２カラムのセクション
------------------------------------------------------- */


.lowerPhotoArea {
    background: #262626;
		background-image: url("../../message/img/img_title-area-applicant.jpg");
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea {
        display:table-cell;
        vertical-align: top;
        width: 50%;
        box-sizing: border-box
    }
}

@media only screen and (max-width: 767px) {
    .lowerPhotoArea .inner {
        padding:270px 6% 25px 6%;
        background: url("../../img/img_home_recruitment_visual_sp.jpg") no-repeat 50% 0;
        background-size: 100% auto
    }
}

@media only screen and (min-width: 768px) {
    .lowerPhotoArea .inner {
        background: url("../../img/img_home_recruitment_visual.jpg") no-repeat 50% 0;
        background-size: 100% auto;
        padding: 50px 30px
    }
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .inner {
        background:none
    }
}

.lowerPhotoArea .headding {
    position: relative;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    color: #fff;
    line-height: 1.25;
    font-weight: bold
}

@media only screen and (max-width: 767px) {
    .lowerPhotoArea .headding {
        font-size:12px;
        font-size: .75rem;
        margin: 0 0 8px 0
    }
}

@media only screen and (min-width: 768px) {
    .lowerPhotoArea .headding {
        font-size:16px;
        font-size: 1rem;
        margin: 0 0 34px 0
    }
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .headding {
        text-align:center
    }
}

.lowerPhotoArea .headding span {
    position: relative
}

@media only screen and (max-width: 767px) {
    .lowerPhotoArea .headding span {
        padding:0 40px 0 0
    }
}

@media only screen and (min-width: 768px) {
    .lowerPhotoArea .headding span {
        padding:0 40px 0 0
    }
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .headding span {
        padding:0 40px
    }
}

.lowerPhotoArea .headding span:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    display: none;
    width: 30px;
    height: 1px;
    background: #bfbfbf
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .headding span:before {
        display:inline-block
    }
}

.lowerPhotoArea .headding span:after {
    content: '';
    position: absolute;
    top: 50%;
    right: 0;
    display: inline-block;
    width: 30px;
    height: 1px;
    background: #bfbfbf
}

@media only screen and (max-width: 767px) {
    .lowerPhotoArea .headding span:after {
        background:#fff
    }
}

@media only screen and (min-width: 768px) {
    .lowerPhotoArea .headding {
        margin:0 0 20px 0
    }
}

.lowerPhotoArea .leadText {
    font-weight: bold;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    line-height: 1.4;
    color: #fff
}

@media only screen and (max-width: 767px) {
    .lowerPhotoArea .leadText {
        margin:0 0 15px 0;
        font-size: 15px;
        font-size: .9375rem
    }
}

@media only screen and (min-width: 768px) {
    .lowerPhotoArea .leadText {
        font-size:24px;
        font-size: 1.5rem;
        margin: 0 0 20px 0
    }
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .leadText {
        text-align:center
    }
}

.lowerPhotoArea .leadText br {
    display: none
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .leadText br {
        display:block
    }
}

.lowerPhotoArea .SectionBlock {
    width: 100%;
    margin: 0 0 15px 0;
    background: #fff
}

.lowerPhotoArea .SectionBlock:after {
    content: "";
    clear: both;
    display: block;
    overflow: hidden
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .SectionBlock {
        text-align:center;
        background: none;
        width: auto;
        font-size: 14px;
        font-size: .875rem
    }
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .SectionBlock.SectionBlock-fullTime {
        margin:0 0 22px 0
    }
}

.lowerPhotoArea .SectionBlock .title {
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    padding: 13px 20px;
    color: #1b76d1
}

@media only screen and (max-width: 767px) {
    .lowerPhotoArea .SectionBlock .title {
        font-size:14px;
        font-size: .875rem
    }
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .SectionBlock .title {
        padding:0;
        margin: 0 0 10px 0;
        color: #fff
    }
}

@media only screen and (max-width: 767px) {
    .lowerPhotoArea .SectionBlock .linkblock {
        font-size:14px;
        font-size: .875rem
    }
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .SectionBlock .linkblock {
        display:inline-block;
        text-align: center
    }
}

.lowerPhotoArea .SectionBlock .linkblock>li {
    box-sizing: border-box;
    border-top: 1px solid #d9d9d9
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .SectionBlock .linkblock>li {
        width:auto;
        float: none;
        display: inline-block;
        border-top: none;
        border-left: 1px solid #535353;
        line-height: 1.25;
        padding: 0 8px 0 15px
    }
}

.lowerPhotoArea .SectionBlock .linkblock>li:nth-child(2n+1) {
    border-right: 1px solid #d9d9d9
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .SectionBlock .linkblock>li:nth-child(2n+1) {
        border-right:none
    }
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .SectionBlock .linkblock>li:first-child {
        border-left:none
    }
}

.lowerPhotoArea .SectionBlock .linkblock>li a {
    position: relative;
    display: block;
    padding: 12px 38px 12px 20px
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .SectionBlock .linkblock>li a {
        color:#b2b2b2;
        padding: 0
    }
}

.lowerPhotoArea .SectionBlock .linkblock>li a:after {
    content: '';
    display: block;
    position: absolute;
    background: url("../img/arrow_right_black.svg") no-repeat 100% 50%;
    background-size: 9px auto;
    top: 50%;
    right: 20px;
    margin: -9px 0 0 0;
    width: 9px;
    height: 18px
}

@media only screen and (max-width: 767px) {
    .lowerPhotoArea .SectionBlock .linkblock>li a:after {
        background:url("../img/arrow_right_black.svg") no-repeat 100% 50%;
        background-size: 7px auto
    }
}

@media only screen and (min-width: 768px) {
    .lowerPhotoArea .SectionBlock .linkblock>li a:after {
        background:url("../img/arrow_right_black.svg") no-repeat 100% 50%;
        background-size: 9px auto
    }
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .SectionBlock .linkblock>li a:after {
        display:none
    }
}

@media only screen and (min-width: 980px) {
    .lowerPhotoArea .SectionBlock .linkblock>li a:hover {
        color:#fff
    }
}

/* loweTextArea ----------------------------------------*/

.loweTextArea {
    background: #fff;
}

.inner-top .loweTextArea {
    background: #1b76d1;
}

@media only screen and (min-width: 980px) {
    .loweTextArea {
        display:table-cell;
        vertical-align: top;
        width: 50%;
        box-sizing: border-box
    }
}

@media only screen and (max-width: 767px) {
    .loweTextArea .inner {
      padding:20px 6% 5px;
    }

		.inner-bottom  {
			padding-bottom: 40px;
		}

		.inner-bottom .loweTextArea .inner {
	    padding-bottom: 0px;
		}
}

@media only screen and (min-width: 768px) {
    .loweTextArea .inner {
        padding:100px 30px 80px;
    }
}
/* Small devices: Tablets (≥768px) */
 @media (min-width: 768px) and (max-width: 991px) {
    .loweTextArea .inner {
        padding:30px 30px;
    }
 }

.loweTextArea .headding {
    position: relative;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    /*color: #fff;*/
    line-height: 1.25;
    font-weight: bold
}

.inner-bottom .loweTextArea .headding{
		color: #1b76d1;
}

@media only screen and (max-width: 767px) {
    .loweTextArea .headding {
        font-size:12px;
        font-size: 1.05rem;
        margin: 0 0 8px 0;
    }

    .inner-top .loweTextArea .headding {
			color: #fff;
			font-size:20px;
	    margin-bottom: 15px;
		}
}

@media only screen and (min-width: 768px) {
    .loweTextArea .headding {
        font-size:16px;
        font-size: 1rem;
        margin: 0 0 34px 0;
    }
}

@media only screen and (min-width: 980px) {
    .loweTextArea .headding {
        text-align:center
    }

		.inner-bottom .loweTextArea .headding{
        text-align:left;
				color: #1b76d1;
				margin-bottom: 20px;
		}
}

.loweTextArea .headding span {
    position: relative
}

@media only screen and (max-width: 767px) {
    .loweTextArea .headding span {
        padding:0 30px 0 0
    }
}

@media only screen and (min-width: 768px) {
    .loweTextArea .headding span {
        padding:0 40px 0 0;
    }
}

/* Small devices: Tablets (≥768px) */
 @media (min-width: 768px) and (max-width: 991px) {
   .loweTextArea .headding span {
     font-size: 1.4em;
	 }

  	.inner-top .loweTextArea .headding span {
			color: #fff;
		}
 }

@media only screen and (min-width: 980px) {
    .loweTextArea .headding span {
        padding:0 40px;
				font-size: 1.7rem;
    }

   	.inner-top .loweTextArea .headding span {
			color: #fff;
		}

    .inner-bottom	.loweTextArea .headding span {
        padding:0 30px 0 0px;
				font-size: 1.1rem;

    }
}

.loweTextArea .headding span:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    display: none;
    width: 20px;
    height: 1px;
    background: #ffffff;
}

.inner-bottom .loweTextArea .headding span:before{
	display: none;
}

@media only screen and (min-width: 980px) {
    .loweTextArea .headding span:before {
        display:inline-block
    }
}

.loweTextArea .headding span:after {
    content: '';
    position: absolute;
    top: 50%;
    right: 0;
    display: inline-block;
    width: 20px;
    height: 1px;
    background: #1b76d1;
}

 .inner-top .loweTextArea .headding span:after {
	 background: #fff;
}

@media only screen and (max-width: 767px) {
    .loweTextArea .headding span:after {
        background:#1b76d1;
    }
}

@media only screen and (min-width: 768px) {
    .loweTextArea .headding {
        margin:0 0 30px 0
    }
}

.loweTextArea .leadText {
    font-weight: bold;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro";
    line-height: 1.4;
    color: #fff
}

@media only screen and (max-width: 767px) {
    .loweTextArea .leadText {
        margin:0 0 25px 0;
        font-size: 15px;
        font-size: .9375rem
    }
}

/* Extra small devices: Phone iphone3,4,5 */
@media (min-width: 320px) and (max-width:374px){
    .loweTextArea .leadText {
      font-size: 0.838rem;
    }
}


@media only screen and (min-width: 768px) {
    .loweTextArea .leadText {
        margin: 0 0 30px 0
    }
}


@media only screen and (min-width: 980px) {
    .loweTextArea .leadText {
        text-align:left;
				color: #1b76d1;
    }

    .inner-top .loweTextArea .leadText {
        text-align:center;
				color: #ffffff;
				font-size: 1.3em;
    }
}

.loweTextArea .leadText br {
    display: none
}

@media only screen and (min-width: 980px) {
    .loweTextArea .leadText br {
        display:block
    }
}


/* -------------------------------------------------------
.lowerContentsNav
------------------------------------------------------- */

.lowerContentsNav ul:after {
    content: "";
    clear: both;
    display: block;
    overflow: hidden
}

@media only screen and (min-width: 768px) {
    .lowerContentsNav ul {
        margin:0 0 20px
    }
}

@media only screen and (min-width: 768px) {
    .lowerContentsNav .lowerContentsNav__list {
        float:left;
        padding: 0 17px 0 20px;
        line-height: 1.25;
        border-left: 1px solid #ccc
    }
}

.lowerContentsNav .lowerContentsNav__list:first-child {
    border: none
}

@media only screen and (min-width: 768px) {
    .lowerContentsNav .lowerContentsNav__list:first-child {
        padding:0 17px 0 0
    }
}

.lowerContentsNav .lowerContentsNav__list a {
    position: relative;
    padding: 0 0 0 18px;
    display: inline-block;
    line-height: 1.25
}

.lowerContentsNav .lowerContentsNav__list a:before {
    display: inline-block;
    content: '';
    position: absolute;
    top: .45em;
    left: 0;
    width: 9px;
    height: 7px;
    background: url("../img/arrow_anchor_black.svg") no-repeat 0 50%;
    background-size: 9px auto;
    transition: all 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1)
}


/* -------------------------------------------------------
RWD 共通
------------------------------------------------------- */

/* Extra small devices: Phones (<768px) */
@media (max-width: 767px) {
    .hidden-xs{
        display: none!important;
    }

    .hidden-over-768{
        display: block!important;
    }

    .visible-over-768{
        display: none!important;
    }


    /* --------------------------------------
    rwd width: 100%;
    --------------------------------------- */
    #header
    {
        width: 100%;
    }

    /* --------------------------------------
    rwd display: none;
    ---------------------------------------- */

    #sidebar
    {
        display: none;
    }

    /* --------------------------------------
    rwd float: none;
    ---------------------------------------- */
    #floatNone
    {
        float: none;
    }
}


@media (min-width: 768px) {
    .visible-xs{
        display: none;
    }

    .visible-over-768{
        display: block!important;
    }

    .hidden-over-768{
        display: none!important;
    }
}


/* ------------------------------------------
clearfix
------------------------------------------- */

.footerSiteMapafter,
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    line-height: 0;
}

.footerSiteMapafter,
.clearfix {
    display: block;
}



@media only screen and (min-width: 768px) {
    .homeSection2rowWrap {
        margin:0 0 80px 0;
        padding: 0 6%
    }

    .homeSection2rowWrap:after {
        content: "";
        clear: both;
        display: block;
        overflow: hidden
    }
}

.sectionHomeVision {
    transition: all 0.8s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
    opacity: 0
}

.sectionHomeVision.show {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

@media only screen and (max-width: 767px) {
    .sectionHomeVision {
        /*margin:0 0 40px 0;*/
				padding-bottom: 40px;
    }
}

@media only screen and (min-width: 768px) {
    .sectionHomeVision {
				/*margin-right: 3%;*/
				padding-bottom: 80px;
    }
}

.sectionHomeMessage {
    transition: all 0.8s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
    opacity: 0
}

.sectionHomeMessage.show {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

@media only screen and (max-width: 767px) {
    .sectionHomeMessage {
			/*margin:0 0 40px 0;*/
		 padding-bottom: 40px;
    }
}

@media only screen and (min-width: 768px) {
    .sectionHomeMessage {
			/*margin-right: 3%;*/
			padding-bottom: 80px;
    }
}

.homeHeddingVisual {
    position: relative
}

@media only screen and (max-width: 767px) {
    .homeHeddingVisual {
        margin:0 0 31px 0
    }
}

@media only screen and (min-width: 768px) {
    .homeHeddingVisual {
        margin:0 0 44px 0
    }
}

.homeHeddingVisual img {
    display: block;
    width: 100%;
    height: auto
}

.section02 {
    background: url(../../img/index_bl01.png) repeat center center;
    background-size: cover;
    -webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1);
    box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1);
    position: relative;
    padding-left: 8%;
    z-index: 900;
    position: relative;

}

.section03 {
    background-size: 100%;
    -webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1);
    box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1);
    position: relative;
    padding-right: 8%;
    z-index: 800;
    position: relative;
		display: flex;
		width: 1000px;
    padding: 0;
}

.topbox {
	text-align: left;
	background: #ededed;
  padding: 1.6em 0;
}

.topbox h3 {
	text-align: left;
	margin-bottom: 20px;
	font-size: 32px;
	color: #333;
  padding-top: 0.5em;
}


.fr {
    float: right;
}

.fl {
    float: left;
}

.fr-img {
	width: 560px;
	text-align: right;
	padding-right: 25px;
}

.fl-img{
	width: 560px;
}

/* sectionHomeWork / works */

.sectionHomeWork {
    padding: 0 6%;
    transition: all 0.8s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
    opacity: 0
		-webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1);
		-moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1);
		box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1);
		z-index: 1000;
		position: relative;
}

.sectionHomeWork:after {
	position: absolute;
  top: 100%;
  left: 48.5%;
  content: '';
  width: 0;
  height: 0;
  border: 30px solid transparent;
  border-top: 30px solid #ffffff;
}

.sectionHomeWork.show {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

@media only screen and (max-width: 767px) {
    .sectionHomeWork {
	    padding-bottom: 40px;
    }
}

@media only screen and (min-width: 768px) {
    .sectionHomeWork {
	    padding-bottom: 80px;
    }
}

.homeWorkBlock {
    margin: 0 -1% 0 -1%
}

.homeWorkBlock:after {
    content: "";
    clear: both;
    display: block;
    overflow: hidden
}


.homeWorkItem {
    box-sizing: border-box;
    position: relative
}

@media only screen and (max-width: 767px) {
    .homeWorkItem {
        width:100%;
        border-bottom: 1px solid #d9d9d9;
        padding: 0 0 0 80px
    }
}

@media only screen and (min-width: 768px) {
    .homeWorkItem {
        width:100%;
        border-bottom: 1px solid #d9d9d9;
        padding: 0 0 0 80px
    }
}

@media only screen and (min-width: 980px) {
    .homeWorkItem {
        float:left;
        width: 18%;
        margin: 0 1%;
        text-align: center;
        padding: 1px;
        border: none
    }
}

.homeWorkItem.homeWorkItem-feature {
    background: url("../../common/img/icon-estate.svg") no-repeat center 20px
}

@media only screen and (max-width: 767px) {
    .homeWorkItem.homeWorkItem-feature {
        background-size:60px auto;
        background-position: 8px center
    }
}

@media only screen and (min-width: 768px) {
    .homeWorkItem.homeWorkItem-feature {
        background-size:60px auto;
        background-position: 8px center
    }
}

@media only screen and (min-width: 980px) {
    .homeWorkItem.homeWorkItem-feature {
        background-size:100px auto;
        background-position: center 30px
    }
}

.homeWorkItem.homeWorkItem-brand {
    background: url("../../common/img/icon-will03.svg") no-repeat
}

@media only screen and (max-width: 767px) {
    .homeWorkItem.homeWorkItem-brand {
        background-position:8px center;
        background-size: 60px auto
    }
}

@media only screen and (min-width: 768px) {
    .homeWorkItem.homeWorkItem-brand {
        background-position:8px center;
        background-size: 60px auto
    }
}

@media only screen and (min-width: 980px) {
    .homeWorkItem.homeWorkItem-brand {
        background-size:80px auto;
        background-position: center 35px
    }
}

.homeWorkItem.homeWorkItem-merit {
    background: url("../../common/img/icon-debt.svg") no-repeat
}

@media only screen and (max-width: 767px) {
    .homeWorkItem.homeWorkItem-merit {
        background-position:10px center;
        background-size: 60px auto
    }
}

@media only screen and (min-width: 768px) {
    .homeWorkItem.homeWorkItem-merit {
        background-position:10px center;
        background-size: 60px auto
    }
}

@media only screen and (min-width: 980px) {
    .homeWorkItem.homeWorkItem-merit {
        background-size:75px auto;
        background-position: center 40px
    }
}

.homeWorkItem.homeWorkItem-jobs {
    background: url("../../common/img/icon-family.svg") no-repeat
}

@media only screen and (max-width: 767px) {
    .homeWorkItem.homeWorkItem-jobs {
        background-position:4px center;
        background-size: 60px auto
    }
}

@media only screen and (min-width: 768px) {
    .homeWorkItem.homeWorkItem-jobs {
        background-position:4px center;
        background-size: 60px auto
    }
}

@media only screen and (min-width: 980px) {
    .homeWorkItem.homeWorkItem-jobs {
        background-size:80px auto;
        background-position: center 30px
    }
}

.homeWorkItem.homeWorkItem-gallery {
    background: url("../../common/img/icon-mansyon.svg") no-repeat
}

@media only screen and (max-width: 767px) {
    .homeWorkItem.homeWorkItem-gallery {
        background-position:4px center;
        background-size: 60px auto
    }
}

@media only screen and (min-width: 768px) {
    .homeWorkItem.homeWorkItem-gallery {
        background-position:4px center;
        background-size: 60px auto
    }
}

@media only screen and (min-width: 980px) {
    .homeWorkItem.homeWorkItem-gallery {
        background-size:80px auto;
        background-position: center 30px
    }
}

.homeWorkItem:first-child {
    border-top: 1px solid #d9d9d9
}

@media only screen and (max-width: 767px) {
    .homeWorkItem:first-child {
        border-top:1px solid #d9d9d9
    }
}

@media only screen and (min-width: 768px) {
    .homeWorkItem:first-child {
        border-top:1px solid #d9d9d9
    }
}

@media only screen and (min-width: 980px) {
    .homeWorkItem:first-child {
        border:none
    }
}

.homeWorkItem .line {
    display: none;
    position: absolute;
    background: #d9d9d9;
    transition: all 0.3s 0s cubic-bezier(0.25, 0.46, 0.45, 0.94)
}

@media only screen and (min-width: 980px) {
    .homeWorkItem .line {
        display:block;
        transition: all 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1)
    }
}

.homeWorkItem .line.line-top {
    top: 0;
    left: 0;
    width: 100%;
    height: 1px
}

.homeWorkItem .line.line-left {
    top: 0;
    left: 0;
    height: 100%;
    width: 1px
}

.homeWorkItem .line.line-bottom {
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px
}

.homeWorkItem .line.line-right {
    right: 0;
    top: 0;
    height: 100%;
    width: 1px
}

.homeWorkItem a {
    display: block;
    background: url("../img/arrow_right_black.svg") no-repeat 100% 50%;
    background-size: 9px auto;
    padding: 15px 15px 15px 0;
}

@media only screen and (min-width: 980px) {
    .homeWorkItem a {
        position:relative;
        padding: 105px 5px 30px 5px;
        box-sizing: border-box;
        background: none;
    }
}

@media only screen and (min-width: 768px) {
    .homeWorkItem a:hover {
        color:#1b76d1
    }
}

.homeWorkItem a:hover .line {
    background: #0295A8;
}

.homeWorkItem a:hover .line.line-top {
    height: 4px
}

.homeWorkItem a:hover .line.line-left {
    width: 4px
}

.homeWorkItem a:hover .line.line-bottom {
    height: 4px
}

.homeWorkItem a:hover .line.line-right {
    width: 4px
}

.homeWorkItem a:hover .title span:after {
    right: -6px
}

.homeWorkItem .subTitle {
    font-weight: bold;
    color: #1b76d1;
    font-size: 12px;
    font-size: .75rem;
    font-family: "Open Sans","sans-serif"
}

@media only screen and (min-width: 980px) {
    .homeWorkItem .subTitle {
        margin:15px 0 5px 0;
    }
}

.homeWorkItem .title {
    font-weight: bold;
    line-height: 1.4;
    font-family: "Yu Gothic","YuGothic","メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro"
}

@media only screen and (max-width: 767px) {
    .homeWorkItem .title {
        margin:0 0 5px 0
    }
}

@media only screen and (min-width: 768px) {
    .homeWorkItem .title {
        font-size:20px;
        font-size: 1.25rem
    }
}

@media only screen and (min-width: 980px) {
    .homeWorkItem .title {
        font-size:20px;
        font-size: 1.25rem;
        margin: 0 -0.7em 3px 0;
    }
}

.homeWorkItem .title span {
    position: relative;
    padding: 0 0.6em 0 0;
    display: inline-block
}

.homeWorkItem .title span:after {
    content: '';
    display: none;
    position: absolute;
    top: 50%;
    right: 0;
    width: 6px;
    height: 12px;
    margin: -6px 0 0 0;
    background: url("../img/arrow_right_black.svg") no-repeat 100% 50%;
    background-size: 6px auto;
    transition: all 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1)
}

@media only screen and (min-width: 980px) {
    .homeWorkItem .title span:after {
        display:block
    }
}

.ie-all .homeWorkItem .title span:after {
    margin: -10px 0 0 0
}

@media only screen and (max-width: 767px) {
    .homeWorkItem .text {
        font-size:12px;
        font-size: .75rem
    }
}

@media only screen and (min-width: 768px) {
    .homeWorkItem .text {
        font-size:14px;
        font-size: .875rem;
				margin-right: -0.7em;
    }
}

.homeWorkItem .text br {
    display: none
}

@media only screen and (min-width: 980px) {
    .homeWorkItem .text br {
        display:block
    }
}

/*  /works  */