@import url('https://fonts.googleapis.com/css?family=Lato:100,300,400,700|Open+Sans');
@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);

/*============================
	レイアウト・背景色・基本文字色
=============================	*/
body {
    color: #000;
    font-family: "游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif !important;
    letter-spacing: 0.1em;
    background-image: url(../../images/208/gbi.jpg);
    background-position: 0 0;
    background-repeat: repeat-y;
}

a {
    color: #000;
    text-decoration: underline;
    transition: 0.2s all;
}

a:hover {
    text-decoration: none;
    opacity: 1;
    color: #de641c;
}

#container {
    position: relative;
    width: 100%;
    margin: 0 auto;
    width: calc(100% - 260px);
    float: left;
}

#container .mainImgIn .inner {
    width: 1000px;
    margin: 0 auto;
    position: relative;
}

#container .mainImgIn .inner::before {
    content: '';
    display: block;
    width: 1000px;
    height: 64px;
    background-color: #fff;
    position: absolute;
    bottom: -1px;
    left: 0px;
    right: 0;
    margin: auto;
    z-index: 1;
}

#container .inner {
    width: 100%;
    margin: 0 auto;
}

#content {
    min-width: 1100px;
    width: 100%;
    margin: 0 auto 50px;
}

#main {
    width: 850px;
    padding-top: 600px;
    margin: 0 auto;
}

.noSlide #main {
    padding-top: 475px;
}

.noSlide .mainImgIn,
.noSlide.noImage .mainImgIn {
    position: static;
    margin-bottom: 0;
    background-image: url(../../images/208/noSlide_bgi.png);
    background-repeat: repeat;
}

/* IE10以降 */
@media all and (-ms-high-contrast:none) {
    .noSlide .mainImgIn {
        background-color: #eee;
    }
}

.noSlide #main,
.noSlide.noImage #main {
    padding-top: 0;
}

#page #main {
    padding-top: 0;
}

#side {
    width: 260px;
    float: left;
}

/*============================
	ヘッダー
=============================*/
header {
    background-color: #de641c;
}

header .headNav {
    letter-spacing: -0.40em;
    display: table-cell;
    vertical-align: top;
    text-align: right;
}

header .headNav li {
    display: inline-block;
    letter-spacing: 0;
    font-size: 1.28em;
    margin-left: 2px;
    font-family: 'Roboto', sans-serif;
    line-height: 1;
}

header .headNav li a {
    background: #edad0b;
    width: 120px;
    text-decoration: none;
    color: #fff;
    display: block;
    text-align: center;
    padding: 52px 0 15px;
}

header .headNav li.profileNav a {
    background: url(../../images/208/ico-headNav_001.png) center 14px #edad0b no-repeat;
}

header .headNav li.accessNav a {
    background: url(../../images/208/ico-headNav_002.png) center 13px #edad0b no-repeat;
}

header .headNav li.contactNav a {
    background: url(../../images/208/ico-headNav_003.png) center 18px #edad0b no-repeat;
}

/*　タイトル
-----------------------------------------*/
header #siteTtl {
    text-align: center;
    font-family: 'Lato', 'Noto Sans Japanese', sans-serif;
    font-weight: 100;
    font-size: 1.714em;
    padding: 65px 50px;
    word-break: break-all;
    letter-spacing: 0.2em;
}

header #siteTtl a {
    text-decoration: none;
    color: #fff;
}

header #siteTtl a:hover {
    opacity: 0.7;
}

header #siteTtl a img {
    max-width: 500px;
    height: auto;
    width: 100%;
}

header #siteTtl a img:hover {
    width: 100%;
}


/*============================
	グロナビ
=============================*/
nav {
    padding: 3px;
    margin-bottom: 52px;
    font-family: 'Lato', 'Noto Sans Japanese', sans-serif;
    font-weight: 300;
    padding: 40px 0;
    border-bottom: 1px solid #323232;
}

nav ul {
    letter-spacing: -0.40em;
    text-align: initial;
}

nav ul li.parent {
    letter-spacing: 0.1em;
    display: block;
    position: relative;
    border-bottom: 1px solid #323232;
}

nav ul li.parent:first-child {
    border-top: 1px solid #323232;
}

nav ul li.parent a > a:before {
    content: "";
    width: 3px;
    height: 1px;
    background-color: #fff;
    position: absolute;
    left: -3px;
    bottom: -1px;
}



nav ul li.parent:last-child {}

nav ul li.parent:last-child {
    border-right: none;
}

nav ul li.parent > a {
    color: #c3c3c3;
    text-decoration: none;
    padding: 14px 20px 14px 36px;
    display: block;
    font-size: 1em;
    letter-spacing: 0.2em;
    -ms-word-break: break-all;
    word-break: break-all;
    position: relative;
    width: calc(100% - 48px);
}

nav ul li.parent span {
    display: inline-block;
    float: right;
    width: 48px;
    height: 48px;
    background-color: #000;
    position: absolute;
    top: 1px;
    right: 0px;
    z-index: 21;
    background: url(../../images/208/nav_arrow_hover.png) center center no-repeat #000;
    transition: 0.2s all;
    transition-property: background;
}

nav ul li.parent > span:hover {
    background: url(../../images/208/nav_arrow_hover.png) center center no-repeat;
    background-color: #de641c;
}

nav ul li.parent.childIn {}

nav ul li.parent.childIn.clicked {
    display: block !important;
}

/*クリックするとclickedのクラスがつくようになっている*/
.clicked {
    display: block !important;
}

/*clickedが付いた要素の擬似要素にスタイルを当てる*/
.clicked span {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
    background: url(../../images/208/nav_arrow_hover.png) center center no-repeat !important;
    background-color: #de641c !important;
}

.clicked ul {
    display: block !important;
}

nav ul li.parent > a:hover {
    color: #616161;
    opacity: 1;
}

/* 子メニュー */
nav .child {
    letter-spacing: 0;
    min-width: 100%;
    width: 254px;
    text-align: left;
    padding: 0;
    display: none;
    z-index: 10;
    clear: right;
}

nav .child:before {
    content: "";
    display: block;
    width: 3px;
    height: 1px;
    position: absolute;
    bottom: -1px;
    left: -3px;
    background-color: #edad0b;
}

nav .child:after {
    content: "";
    display: block;
    width: 3px;
    height: 1px;
    position: absolute;
    bottom: -1px;
    right: -3px;
    background-color: #edad0b;
}

nav .child li {
    background: #323232;
}

nav .child li a {
    color: #a6a6a6;
    font-size: 1em;
    text-decoration: none;
    display: block;
    padding: 7px 25px 7px 40px;
    position: relative;
}

nav .child li a:hover {
    opacity: 0.6;
}

nav .child li:first-child {
    padding-top: 13px;
}

nav .child li:last-child {
    padding-bottom: 13px;
}

/* topのみ */
#top nav {}


/*============================
	メインスライド
=============================*/


.headerIn.slide {
    background: none;
}

.headerIn.slide header {
    height: 600px;
}

.headerIn.slide .siteTtlIn {
    background: rgba(0, 0, 0, 0.3);
}

.mainSlideIn {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 1100px;
    width: 100%;
    max-width: 100% !important;
    height: 600px !important;
    overflow: hidden;
}

.bx-wrapper {
    max-width: 100% !important;
}

.bx-wrapper::before {
    content: '';
    display: block;
    width: 1000px;
    height: 64px;
    background-color: #fff;
    position: absolute;
    bottom: 0;
    left: 0px;
    right: 0;
    margin: auto;
    z-index: 1;
}

@media screen and (max-width: 1400px) {
    .bx-wrapper::before {
        width: 100%;
    }
}

#mainSlide li {
    position: relative;
    background: rgba(0, 0, 0, 0.2);
    overflow: hidden;
    height: 600px !important;
}

#mainSlide li img {
    position: absolute;
    left: 0;
    width: 100%;
    height: auto;
}

/* pager */
.bx-wrapper .bx-pager {
    padding-top: 0 !important;
    bottom: 80px !important;
    z-index: 10;
}

/* Safariのみ */
@media screen and (-webkit-min-device-pixel-ratio:0) {

    ::i-block-chrome,
    .bx-wrapper .bx-pager {
        bottom: 86px !important;
    }
}

.bx-wrapper .bx-pager.bx-default-pager a {
    background: #fff;
    text-indent: -9999px;
    display: block;
    width: 6px;
    height: 6px;
    margin: 0 4px;
    outline: 0;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
    background: #de641c;
    opacity: 1;
}

/* controlBtn */
.bx-wrapper .bx-controls-direction a {
    margin: 0;
    top: 50%;
    margin-top: -40px;
}

.bx-wrapper .bx-prev {
    width: 41px;
    height: 80px;
    background: url(../../images/205/btn-slider_001.png);
    left: 60px;
}

.bx-wrapper .bx-next {
    width: 40px;
    height: 78px;
    background: url(../../images/205/btn-slider_002.png);
    right: 60px;
}

/* pager */

/* controlBtn */
.bx-wrapper .bx-controls-direction a {
    width: 50px;
    height: 50px;
    margin: 0;
    top: 480px;
}

.bx-wrapper .bx-prev {
    background: url(../../images/208/btn-slider_001.png) center center no-repeat;
    left: calc(50% - 84px);
}

.bx-wrapper .bx-prev:hover {
    background: url(../../images/208/btn-slider_001.png) center center no-repeat;
    opacity: 1;
}

.bx-wrapper .bx-next {
    background: url(../../images/208/btn-slider_002.png) center center no-repeat;
    right: calc(50% - 84px);
}

.bx-wrapper .bx-next:hover {
    background: url(../../images/208/btn-slider_002.png) center center no-repeat;
    opacity: 1;
}


/*============================
	メインイメージ
=============================*/
.mainImgIn {
    margin-bottom: 95px;
    position: absolute;
    width: 100%;
    background: url(../../images/208/noSlide_bgi.png);
}

.mainImgIn .inner {
    display: table;
    padding: 70px 0 134px;
}

.mainImgIn .inner #mainImg {
    width: 365px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.mainImgIn .inner #leadTxt {
    display: table-cell;
    vertical-align: middle;
    padding-left: 40px;
    font-weight: normal;
    line-height: 2;
    font-size: 1em;
}

.noImage .mainImgIn .inner #leadTxt {
    padding-left: 0;
}

/*============================
	メインエリア
=============================*/
#main .contTtl {
    font-size: 1.714em;
    line-height: 1.3;
    padding-bottom: 20px;
    letter-spacing: 1px;
    position: relative;
}

#main div:last-child {
    margin-bottom: 0;
}

/* leadTxt */
#leadTxt {
    line-height: 2.14;
    font-weight: normal;
    position: relative;
    margin-bottom: 50px;
    text-align: justify;
}

/* news */
#news .contTtl {
    color: #000;
    font-size: 2.571em;
    font-family: 'Lato', 'Noto Sans Japanese', sans-serif;
    font-weight: 300;
    position: relative;
    text-indent: -0.09em;
    margin-bottom: 25px;
}

#news .contTtl::after {
    content: '';
    display: block;
    width: 64px;
    height: 2px;
    background-color: #000;
    position: absolute;
    bottom: 0;
}

#news ul {
  height: 251px;
  overflow: scroll;
  line-height: 1.1;
  margin-bottom: 73px;
}

#news ul li {
    padding: 17px 20px 17px 125px;
    position: relative;
    border-bottom: 1px dotted #000;
    line-height: 1.3;
}

#news ul li:first-child {
    border-top: 1px dotted #000;
}

#news ul .day {
    display: block;
    width: 108px;
    position: absolute;
    left: 22px;
    font-family: 'Roboto', sans-serif;
}

#news dl dd {
    float: left;
    width: 782px;
    padding: 10px 0;
    border-top: 1px dotted #000;
}

/* article */
.articleBox {
    margin-bottom: 70px;
}

.articleBox .contTtl {
    font-weight: normal;
    padding-bottom: 25px !important;
    margin-bottom: 44px;
}

.articleBox .contTtl::after {
    content: '';
    display: block;
    width: 64px;
    height: 2px;
    background-color: #000;
    position: absolute;
    bottom: 0;
}

.articleIn .articleBox:last-child {}

.articleBox .txtArea {
    width: 525px;
    float: left;
    font-size: 1em;
    line-height: 2;
    text-align: justify;
}

.articleBox.noImg .txtArea {
    width: auto;
    float: none;
}

.articleBox.noImg .txtArea p:last-child {
    margin-bottom: 30px;
}

.articleBox .txtArea p:last-child {
    margin-bottom: 30px !important;
}

.articleBox .txtArea strong {
    font-weight: bold;
}

.articleBox .imgArea {
    width: 300px;
    float: right;
}

.articleBox .imgArea figure {
    margin-bottom: 35px;
}

.articleBox .imgArea figure:last-child {
    margin-bottom: 0;
}

.articleBox .imgArea figure figcaption {
    display: block;
    font-size: 0.857em;
    margin-top: 18px;
    line-height: 1.6;
}

#main .articleBox table {
    width: 100%;
    font-size: 1em;
    text-align: center;
}

table,
table td,
table th {
    border: 1px solid #c0c0c0;
}

table td,
table th {
    padding: 10px 15px;
}

table th {
    text-align: center;
    font-weight: bold;
    background-color: #f8f7f6;
}

/* contactBtn */
.contactBtn {
    width: 505px;
    margin: 0 auto 70px;
}

.contactBtn a {
    display: block;
    background: #de641c;
    text-decoration: none;
    text-align: center;
    color: #fff;
    line-height: 60px;
    height: 60px;
    font-size: 2.143em;
    font-family: 'Lato', 'Noto Sans Japanese', sans-serif;
    font-weight: 100;
}

.contactBtn a:hover {
    opacity: 0.7;
}


/*============================
	サイドエリア
=============================*/
#top #side {}

#side {
    height: 100%;
    float: left;
}

#side div:last-child,
#side h2:last-child {
    margin-bottom: 0;
}

#side .sideTtl {
    color: #c3c3c3;
    padding: 0 0 10px 36px;
    line-height: 1.2;
    font-family: 'Lato', 'Noto Sans Japanese', sans-serif;
    font-weight: 300;
    font-size: 1em;
    letter-spacing: 0.2em;
}


/* sideCont */
#side #sideCont .sideTtl {}

#side #sideCont {
    letter-spacing: 0.1em;
    line-height: 1;
    margin-bottom: 52px;
    border-bottom: 1px solid #323232;
    padding-bottom: 47px;
}

#side #sideCont ul li {
    font-size: 0.857em;
}

#side #sideCont ul li a {
    display: block;
    text-decoration: none;
    padding: 10px 36px;
    position: relative;
    font-family: 'Lato', 'Noto Sans Japanese', sans-serif;
    font-weight: 400;
    color: #939393;
    -ms-word-break: break-all;
    word-break: break-all;
}

#side #sideCont ul li a:hover {
    opacity: 1;
    color: #616161;
}

/* blog */
#side #blog {
    line-height: 1.3;
    margin-bottom: 52px;
    border-bottom: 1px solid #323232;
    padding-bottom: 47px;
}

#side #blog dl dt {
    color: #939393;
    font-size: 0.929em;
    margin-bottom: 5px;
    padding: 13px 20px 0 36px;
}

#side #blog dl dd {
    padding: 0 20px 26px 36px;
}

#side #blog dl dd a {
    color: #939393;
    font-size: 0.929em;
    text-decoration: none;
}

#side #blog dl dd a:hover {
    color: #dcdcdc;
    opacity: 1;
}

#side #blog .btn {}

#side #blog .btn a {
    color: #de641c;
    font-family: 'Lato', 'Noto Sans Japanese', sans-serif;
    letter-spacing: 0.2em;
    padding: 10px 3px 10px 36px;
    text-decoration: none;
    position: relative;
}

#side #blog .btn a:before {
    content: "";
    display: block;
    position: absolute;
    background: url(../../images/208/blog_arrow.png) no-repeat;
    width: 129px;
    height: 9px;
    top: 15px;
    margin-top: -4px;
    z-index: 1;
    left: 94px;
}

#side #blog .btn a:hover {
    opacity: 0.7;
}

#side #blog .btn a:hover:before {
    opacity: 0.7;
}

/* mobile */
#side #mobile {
    margin-bottom: 52px;
    border-bottom: 1px solid #323232;
    padding-bottom: 47px;
}

#side #mobile figure {
    padding: 28px 28px 24px 36px;
}

#side #mobile figure img {
    width: 100px;
    height: 100px;
}

#side #mobile figure figcaption {
    text-align: left;
    line-height: 2;
    padding-top: 20px;
    color: #939393;
    font-size: 0.857em;
}

/*============================
	ページトップ
=============================*/
#pageTop {
    position: fixed;
    z-index: 1000;
    right: 18px;
    bottom: 25px;
    width: 60px;
    height: 60px;
    border-radius: 30px;
    display: none;
}

#pageTop a {
    display: block;
    width: 60px;
    height: 60px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    border-radius: 30px;
    background: url(../../images/208/page_top_arrow.png) center 21px no-repeat #000000;
}

#pageTop a:hover {
    background: url(../../images/208/page_top_arrow.png) center 21px no-repeat #616161;
    opacity: 1;
}

/*============================
	フッター
=============================*/
footer {}

footer .copy {
    line-height: 1.2;
    padding: 0 0 50px 35px;
    font-size: 0.857em;
}

/*============================
	フリーエリア
=============================*/
.freeArea {
    line-height: 2;
    color: #616161;
    padding: 0px 28px 24px 36px;
}

#side-area.freeArea {
    color: #939393;
}

#side-area.freeArea > a {
    color: #de641c;
}

#side-area.freeArea > a:hover {
    text-decoration: none;
}

/*============================
	下層ページ共通
=============================*/
/* pageTtl */
.pageTtl {
    padding: 66px 0;
    min-width: 1000px;
    min-height: 200px;
    width: 100%;
    background: url(../../images/208/main_nottop.jpg) no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
}

.pageTtl h2 {
    font-size: 2.571em;
    line-height: 1.3;
    text-align: center;
    font-family: 'Lato', 'Noto Sans Japanese', sans-serif;
    font-weight: 300;
    width: 700px;
    margin: 0 auto;
    -ms-word-break: break-all;
    word-break: break-all;
}

/* pnkz */
#pnkz {
    letter-spacing: -0.40em;
    text-align: right;
    width: 1000px;
    margin: 0 auto 65px;
    font-size: 0.85em;
    position: relative;
    padding-right: 30px;
    background-color: #fff;
    margin-top: -20px;
    padding-bottom: 5px;
}

#pnkz::before {
    content: '';
    display: block;
    width: 1000px;
    height: 42px;
    background-color: #fff;
    position: absolute;
    top: -42px;
    left: 0px;
}

#pnkz li {
    letter-spacing: 0;
    display: inline-block;
}

#pnkz li:after {
    content: ">";
    margin: 0 10px;
}

#pnkz li:last-child:after {
    display: none;
}


/*============================
	お問い合わせフォーム、プロフィール、地図
=============================*/
#main.form table,
#main.profile table,
#main.map table {
    border-bottom: 1px solid #d5c293;
    width: 100%;
    font-size: 1.14em;
    margin-bottom: 70px;
}

#main.form table th,
#main.form table td,
#main.profile table th,
#main.profile table td,
#main.map table th,
#main.map table td {
    padding: 15px 20px;
}

#main.form table th,
#main.profile table th,
#main.map table th {
    text-align: center;
    font-weight: bold;
    padding-right: 0;
    padding-left: 0;
}

#main.form .txtBox,
#main.profile .txtBox,
#main.map .txtBox {
    font-size: 1em;
    line-height: 1.87;
    margin-bottom: 50px;
}

#main.form .txtBox p,
#main.profile .txtBox p,
#main.map .txtBox p {
    margin-bottom: 30px;
}

/* form */
#main.form {}

#main.form .requiredMark {
    color: #ce0000;
}

#main.form table th {
    width: 270px;
}

#main.form table td {
    height: 80px;
}

#main.form .inputArea {
    background: #f1f1f1;
    line-height: 1;
    padding: 8px 15px;
    border-radius: 2px;
    width: 520px;
    border: 1px solid #ddd;
}

#main.form .inputArea.short {
    width: 200px;
    display: inline-block;
}

#main.form .inputArea input {
    width: 100%;
}

#main.form .inputArea input:focus,
#main.form .inputArea textarea:focus,
#main.form .inputArea button:focus {
    outline: none;
}

#main.form .inputArea textarea {
    width: 100%;
    height: 190px;
    padding: 10px 0;
    line-height: 1.5;
}

#main.form table {
    border-bottom: none;
}

#main.form #submit td {
    text-align: center;
    letter-spacing: -0.40em;
    padding-top: 40px;
}

#main.form #submit input {
    display: inline-block;
    width: 240px;
    text-align: center;
    color: #fff;
    font-weight: normal;
    line-height: 1;
    padding: 18px 0;
    cursor: pointer;
    letter-spacing: 0.1em;
    margin: 0 10px;
    font-size: 1.12em;
}

#main.form #submit input.submitBtn {
    background: #de641c;
    transition: 0.2s all;
}

#main.form #submit input.resetBtn {
    background: #bbb;
}

#main.form #submit input:hover {
    opacity: 0.7;
}

/* map */
#main.map #frame {
    margin-bottom: 70px;
}

#main.map #frame iframe {
    width: 850px;
    height: 478px;
}

/* 20170703 ADD */
#side-area img {
    max-width: 100%;
}

#foot-area img {
    max-width: 100%;
}

/* pc版メディアクエリー */
@media screen and ( min-width:1450px) and ( max-width:1700px) {
	#top #main {
    padding-top: 490px;
	}
	#mainSlide li {
	    max-height: 490px !important;
	}
	#mainSlide li img{
			height:auto;
	}
  .bx-wrapper .bx-controls-direction a {
    top: 370px;
  }
}
@media screen and ( min-width:1420px) and ( max-width:1450px) {
	#top #main {
		padding-top: 480px;
	}
	#mainSlide li {
	    max-height: 480px  !important;
	}
  .bx-wrapper .bx-controls-direction a {
    top: 360px;
  }
}
@media screen and ( max-width:1420px) {
	#mainSlide li {
	    max-height: 490px !important;
	}
  .bx-wrapper .bx-controls-direction a {
    top: 370px;
  }
}
@media screen and ( min-width:1380px) and ( max-width:1420px) {
	#top #main {
		padding-top: 470px;
	}
	#mainSlide li {
	    max-height: 470px  !important;
	}
  .bx-wrapper .bx-controls-direction a {
    top: 350px;
  }
}
@media screen and ( max-width:1380px) {
	#top #main {
		padding-top: 490px;
	}
}

/* 20190416 ADD */
.box ul,
.box1 ul,
.box2 ul,
.box3 ul,
.articleBox ul,
.entry_box ul,
.entryBox ul,
.article-box ul,
.article ul,
.article_box ul {
    list-style-type: disc;
}

.box ol,
.box1 ol,
.box2 ol,
.box3 ol,
.articleBox ol,
.entry_box ol,
.entryBox ol,
.article-box ol,
.article ol,
.article_box ol {
    list-style-type: decimal;
}

.box ul,
.box1 ul,
.box2 ul,
.box3 ul,
.articleBox ul,
.entry_box ul,
.entryBox ul,
.article-box ul,
.article ul,
.article_box ul,
.box ol,
.box1 ol,
.box2 ol,
.box3 ol,
.articleBox ol,
.entry_box ol,
.entryBox ol,
.article-box ol,
.article ol,
.article_box ol {
    margin-left: 18px;
}
