@charset "UTF-8";

/*==================================================================================================

       リセット

===================================================================================================*/

html, body, div, span, applet, object, iframe, strong,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, legend, caption, 
tbody, tfoot, thead, table, label, tr, th, td{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-style: inherit;
	font-family: inherit;
	vertical-align: baseline;
	list-style:none;
	}
ul { 
	letter-spacing: -1em;
	word-spacing: -1em;
	}
:root ul {
	letter-spacing: -1px;
	word-spacing: -1px;
	}
li { 
	letter-spacing: normal;
	word-spacing: normal;
	*display: inline;
	*zoom: 1;
	}
figure { margin:0;}
img,iframe	{ vertical-align:bottom;}

/*==================================================================================================

       メイン設定

===================================================================================================*/

html,body { width:100%; min-width: 320px; *width:320px; font-size:16px; }
body {
	background: #FFF;
    font-family: 'Noto Serif JP', serif;
	letter-spacing:0.05em;
	color: #1F1F1F;
    font-weight: 500;
	text-align:left;
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	line-height:200%;
    font-feature-settings: "palt" 1;
  	}

    .wrapper    { overflow:hidden;}
    article		{ position:relative; width:100%; z-index: 0;}
    section		{ position:relative; }

    .section-l	{ padding-top:12rem; padding-bottom:12rem; }
    .section	{ padding-top:9rem; padding-bottom:9rem; }
    .section-m  { padding-top: 5rem; padding-bottom: 5rem; }
    .section-s  { padding-top: 4rem; padding-bottom: 4rem; }
    .second	    { padding-top:0 !important; }
    .outer		{ padding-left:50px; padding-right:50px; box-sizing:border-box; }

    .inner-1px { padding:1px; box-sizing: border-box;}
    .inner-outer { padding-left:50px; padding-right:50px; box-sizing: border-box; }

    .row			{ margin-left:auto; margin-right:auto; position: relative;}
    .row .row		{ min-width: 0px; }
    .row:before,
    .row:after      { content:""; display:table; }
    .row:after      { clear: both; }
    .row            { zoom: 1; }

	.center		{ text-align:center;}
    .center-left{ text-align:center;}
    .left-center{ text-align: left;}
	.text-l		{ text-align:left;}
    .text-r		{ text-align:right;}
	.float-l	{ float:left; }
	.float-r	{ float:right; }
    .margin-auto { margin-left:auto; margin-right:auto; }
    
    .bottom-none { padding-bottom:0 !important;}
    
    small { font-size:.75rem; }
    .bold { font-weight:bold;}

@media screen and (max-width: 1087px) {
    html,body, .wrapper	{ font-size:13px; line-height: 190%;}
    .outer			   { padding-left:25px; padding-right:25px; }
    .inner-outer       { padding-left:25px; padding-right:25px; }
    .section-l	       { padding-top:7rem; padding-bottom:7rem; }
    .section	       { padding-top:7rem; padding-bottom:7rem; }
    .section-m	       { padding-top:4rem; padding-bottom:4rem; }
    .section-s	       { padding-top:3rem; padding-bottom:3rem; }
    }
@media only screen and (max-width: 767px) {
    html,body, .wrapper	{ font-size:12px; letter-spacing: .5px; line-height: 180%;}
	body			{ -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
    .section	    { padding-top:5rem; padding-bottom:5rem; }
    .section-m	    { padding-top:4rem; padding-bottom:4rem; }
    .section-s	    { padding-top:2rem; padding-bottom:2rem; }
    .outer			{ padding-left:15px; padding-right:15px; }
    .inner-outer    { padding-left:10px; padding-right:10px; }
    .center-left    { text-align:left;}
    .left-center    { text-align:center;}
    }

/*==================================================================================================

       Width ( wrap + wrap-1200 )

===================================================================================================*/

    .wrap       { width:100%; margin-left:auto; margin-right:auto; }

    .wrap-1800  { max-width:1800px; }
    .wrap-1700  { max-width:1700px; }
    .wrap-1600  { max-width:1600px; }
    .wrap-1500  { max-width:1500px; }
    .wrap-1400  { max-width:1400px; }
    .wrap-1300  { max-width:1300px; }
    .wrap-1200  { max-width:1200px; }
    .wrap-1100  { max-width:1100px; }
    .wrap-1000  { max-width:1000px; }
    .wrap-900   { max-width: 900px; }
    .wrap-800   { max-width: 800px; }
    .wrap-750   { max-width: 750px; }
    .wrap-600   { max-width: 600px; }

    .max150     { max-width:150px; width:100%;}
    .max280     { max-width:280px; width:100%;}
    .max300     { max-width:300px; width:100%;}
    .max500     { max-width:500px; width:100%;}
    .max550     { max-width:550px; width:100%;}
    .max600     { max-width:600px; width:100%;}
    .max650     { max-width:650px; width:100%;}

    .w4em { width:4em; }
    .w5em { width:5em; }
    .w6em { width:6em; }
    .w7em { width:7em; }
    .w8em { width:8em; }
    .w9em { width:9em; }
    .w10em { width:10em; }
    .w11em { width:11em; }
    .w12em { width:12em; }
    .w14em { width:14em; }

    .w32p       { width:32.962963%;}
    .w66p       { width:66.666667%; }
    
    .w20p { width:20%; }
    .w25p { width:25%; }
    .w33p { width:33%; }
    .w50p { width:50%; }

    .h100p { height:100%; }

    .flex300    { max-width:300px; min-width:300px; width:300px; }
    .flex330    { max-width:330px; min-width:330px; width:330px; }
    .flex500    { max-width:500px; min-width:500px; width:500px; }
    .flex900    { max-width:900px; min-width:900px; width:900px; }

@media screen and (max-width: 1087px) {
    .max550 { max-width:100%;}
    .wrap { max-width:700px; }
    .is-tablet .flex{ max-width:100% !important; min-width:100% !important;}
    }
@media only screen and (max-width: 767px) {
    .wrap { max-width:350px; }
    .is-mobile .flex{ max-width:100% !important; min-width:100% !important;}
    }

/*==================================================================================================

       Link

===================================================================================================*/

a {
	text-decoration:none;
	color:#1F1F1F;
	cursor:pointer;
	}
	a:hover {
	color:#666;
	}
	a img {
	-webkit-transition  : all .3s ease;
        -moz-transition : all .3s ease;
        -ms-transition  : all .3s ease;
            transition  : all .3s ease;
	}
	a:hover img {
	opacity:0.6;
	filter: alpha(opacity=60);
	-ms-filter: "alpha( opacity=60 )";
	}

/*==================================================================================================

       Others

===================================================================================================*/

    img {
        max-width: 100%;
        height: auto;
        width /***/:auto;
        vertical-align:bottom;
        }
    .anchor	{
	padding-top:120px;
	margin-top:-120px;
	}

/*==================================================================================================

       title

===================================================================================================*/

.th40 img { height:40px; width:auto;}

.f17 {font-size:17px;}
.f18 {font-size:18px;}
.f21 {font-size:21px;}
.f24 {font-size:24px;}
.f27 {font-size:27px;}
.f30 {font-size:30px;}
.f33 {font-size:33px;}
.f36 {font-size:36px;}

.lh180 { line-height:180%; }
.lh200 { line-height:200%; }
.lh220 { line-height:220%; }
.lh250 { line-height:250%; }

@media screen and (max-width: 1087px) {
    .th40 img { height:30px;}
    .f17 {font-size:15px;}
    .f18 {font-size:16px;}
    .f21 {font-size:17px;}
    .f24 {font-size:18px;}
    .f27 {font-size:18px;}
    .f30 {font-size:22px;}
    .f33 {font-size:25px;}
    .f36 {font-size:27px;}
    .lh220 { line-height:200%; }
    .lh250 { line-height:200%; }
}
@media screen and (max-width: 767px) {
    .th40 img { height:24px;}
    .f17 {font-size:12px;}
    .f18 {font-size:13px;}
    .f21 {font-size:14px;}
    .f24 {font-size:15px;}
    .f27 {font-size:16px;}
    .f30 {font-size:18px;}
    .f33 {font-size:19px;}
    .f36 {font-size:21px;}
    .lh180 { line-height:160%; }
    .lh200 { line-height:180%; }
    .lh220 { line-height:180%; }
    .lh250 { line-height:180%; }
}

/*==================================================================================================

      　hover_zoom

===================================================================================================*/

.hover-zoom__image {
    overflow: hidden;
    position: relative;
    width:100%;
    -webkit-transition  : all .3s ease-in;
        -moz-transition : all .3s ease-in;
        -ms-transition  : all .3s ease-in;
            transition  : all .3s ease-in;
    }
    .hover-zoom__image figure {
    -webkit-transition  : all .3s ease-out;
        -moz-transition : all .3s ease-out;
        -ms-transition  : all .3s ease-out;
            transition  : all .3s ease-out;
    }
    .hover-zoom__image:hover figure,
    a:hover .hover-zoom__image figure {
    opacity: 1;
    -moz-transform:    scale(1.1);
    -webkit-transform: scale(1.1);
    -ms-transform:     scale(1.1);
    transform:         scale(1.1);
    }
    .hover-zoom__image a:hover img,
    a:hover .hover-zoom__image img {
	opacity:1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
	}

/*==================================================================================================

       デバイス

===================================================================================================*/

    .sp-none        { }
    .sp-inline-none { display:inline-block;}
	.sp-on		    { display:none;}
    .sp-inline-on   { display:none;}
	.tablet-on		{ display:none;}
	.tablet-none	{ }
    
    .w1350-on		{ display:none;}
    .w1350-none	    { display:inherit;}
@media screen and (max-width: 1350px) {
    .w1350-on		{ display:inherit;}
	.w1350-none	    { display:none;}
    }
@media screen and (max-width: 1087px) {
    .tablet-on		{ display:inherit;}
	.tablet-none	{ display:none;}
    }
@media screen and (max-width: 767px) {
    .sp-none		{ display:none;}
    .sp-inline-none { display:none;}
	.sp-on			{ display:inherit;}
    .sp-inline-on   { display:inline;}
	.sp-text-l		{ text-align:left !important;}
	.sp-center		{ text-align:center;}
    }

/*==================================================================================================

       Flex

===================================================================================================*/

.flex-wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content:center;
    align-items: center;
    align-content:stretch;
    display: -webkit-flex;
    -webkit-flex-direction: row;
    -webkit-flex-wrap: nowrap;
    height:100%;
    }
    .flex-wrap.is-align-stretch { /* 上端揃え */
    align-items: stretch;
    }
    .is-align-flexend { /* 下端揃え */
    align-items: flex-end;
    }
    .is-content-flexend { /* 右端揃え */
    justify-content: flex-end;
    }
    .flex-side-center { /* 子要素の左右の中央揃え IE一部バグあり */
    display: flex;
    justify-content: center;
    }
    .flex-wrap.is-between { /* 子要素の等間隔 + 両端揃え */
    justify-content: space-between;
    }
    .flex {
    flex: none;
    display: block;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1;
    width: 100%;
    box-sizing: border-box;
    }
    .top-auto .column { margin-top:auto; }/* 子要素の下端揃え */

@media screen and (max-width: 1087px) {
    .flex-wrap.is-tablet { -webkit-flex-direction: column; flex-direction: column; flex: none; display: block; }
    }
@media screen and (max-width: 767px) {
    .flex-wrap.is-mobile { -webkit-flex-direction: column; flex-direction: column; flex: none; display: block; }
    }

.column .inner { width:100%;}
.vertical-center { /* columnに付与 直下にinner設置 */
    display: flex;
    align-items: center;
    }
.vertical-side-center { /* IE でimgにバグあり */
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    }
    /* IE でのflex+figure バグ対策 */
    @media all and (-ms-high-contrast: none) {
    .vertical-side-center figure,
    .vertical-side-center img { width:100%; height:100%; }
    }
.reverse-row-order {
    flex-direction: row-reverse;
    }

/*==================================================================================================

      　pace

===================================================================================================*/

.intro {
    position: fixed;
    width:100%;
    height: 100%;
	z-index:-10;
	background:rgba(255,255,255,1);
	animation: fadeOut 1s ease 0s 1 normal;
	-webkit-animation: fadeOut 1s ease 0s 1 normal;
    opacity: 0;
	}
	@keyframes fadeOut {
	0% {opacity: 1; z-index:90000;}
    50% {opacity: 1; z-index:90000;}
	100% {opacity: 0; z-index:-10;}
	}
	@-webkit-keyframes fadeOut {
	0% {opacity: 1; z-index:90000;}
    50% {opacity: 1; z-index:90000;}
	100% {opacity: 0; z-index:-10;}
	}

#site_loader_overlay {
    z-index: 99999;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    width: 100vw;
    height: 100%;
    height: 100vh;
    background: #fff;
    opacity: 1;
    }
    .c-load {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 48px;
        height: 48px;
        margin: auto;
        border-radius: 50%;
        font-size: 10px;
        text-indent: -9999em;
        -webkit-animation: loading-circle 1.1s infinite linear;
        animation: loading-circle 1.1s infinite linear;
        border: 3px solid rgba(10, 10, 10, 0.2);
        border-top-color: #0a0a0a;
        }
@-webkit-keyframes loading-circle { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
@keyframes loading-circle { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

/*==================================================================================================

       ボタン

===================================================================================================*/

.more {
        position:relative;
        font-weight:300;
        font-size:14px;
        width:100%;
        max-width:120px;
        }
        .more a {
        color:#FFF;
        width:100%;
        text-align: center;
        padding:12px 0;
        line-height:1;
        background: #253149;
        white-space: nowrap;
        text-decoration:none !important;
        position: relative;
        z-index: 1;
        -webkit-transition: all 0.3s ease;
           -moz-transition: all 0.3s ease;
             -o-transition: all 0.3s ease;
                transition: all 0.3s ease;
        display: inline-block;
        }
        .more a:after {
        position: absolute;
        content: "";
        width: 0;
        height: 100%;
        top: 0;
        right: 0;
        z-index: -1;
        -webkit-transition: all 0.3s ease;
           -moz-transition: all 0.3s ease;
             -o-transition: all 0.3s ease;
                transition: all 0.3s ease;
        background:rgba(255,255,255,.3);
        }
        .more a:hover { }
        .more a:hover:after { left: 0; width: 100%; }
        
        .more.white a { background: #FFF; color:#1F1F1F; }
        .more.white a:after { background: #CCC; }
        
        .more.att-more { max-width:100%; }
        .more.att-more a { padding:30px 0; background: url("../images/parts/blue.jpg") center center repeat;}
        .more.cta-contact { max-width:100%; }
        .more.cta-contact a { background: #990000; padding:26px 0; }
        .more.cta-line { max-width:100%; }
        .more.cta-line a { background: #333333; padding:26px 0; }
        .more.line { max-width:100%; }
        .more.line a { padding:24px 0; background:#333;}
        
        .more.category-btn a { padding:15px 0; background:#EDEDEE; color:#17191F; font-size:13px; letter-spacing:.025em; }
        .more.archive-btn a  { padding:15px 0; background:#C6C9D4; color:#17191F; font-size:13px; letter-spacing:.025em; }

    @media only screen and (max-width: 1087px) {
        .more { font-size:13px; }
        .more.att-more a { padding:20px 0;}
        .more.cta-contact a { padding:20px 0; }
        .more.cta-line a { padding:20px 0; }
        .more.category-btn a { padding:13px 0; font-size:12px; }
        .more.archive-btn a  { padding:13px 0; font-size:12px; }
    }
    @media only screen and (max-width: 767px) {
        .more { font-size:12px; }
        .more.category-btn { max-width:57px; margin-left:1px; }
        .more.archive-btn  { max-width:57px; margin-left:1px; }
        .more.category-btn a { font-size:10px; letter-spacing:0; border-radius:3px; }
        .more.archive-btn a  { font-size:10px; letter-spacing:0; border-radius:3px; }
    }

/*==================================================================================================

       padding margin 設定

===================================================================================================*/

	.pt-1em		{ padding-top:1rem;}
	.pt-2em		{ padding-top:2rem;}
	.pt-3em		{ padding-top:3rem;}
	.pt-4em		{ padding-top:4rem;}
	.pt-5em		{ padding-top:5rem;}

    .pb-05em	{ padding-bottom:.5rem;}
    .pb-1em		{ padding-bottom:1rem;}
    .pb15em	    { padding-bottom:1.5rem;}
	.pb-2em		{ padding-bottom:2rem;}
	.pb-3em		{ padding-bottom:3rem;}
	.pb-4em		{ padding-bottom:4rem;}
	.pb-5em		{ padding-bottom:5rem;}

    .mt-1em		{ margin-top:1rem;}
	.mt-2em		{ margin-top:2rem;}
	.mt-3em		{ margin-top:3rem;}
	.mt-4em		{ margin-top:4rem;}
	.mt-5em		{ margin-top:5rem;}

	.mb-1em		{ margin-bottom:1rem;}
	.mb-2em		{ margin-bottom:2rem;}
	.mb-3em		{ margin-bottom:3rem;}
	.mb-4em		{ margin-bottom:4rem;}
	.mb-5em		{ margin-bottom:5rem;}

    .pt-2-1		{ padding-top:2rem;}
    .pt-3-2		{ padding-top:3rem;}
    .pb-2-1		{ padding-bottom:2rem;}
    .pb-3-2		{ padding-bottom:3rem;}
    .pb-4-0		{ padding-bottom:4rem;}
    .pb-4-1		{ padding-bottom:4rem;}
    .pb-4-2		{ padding-bottom:4rem;}
    .pb-5-2		{ padding-bottom:4rem;}
    .mb15-1 	{ margin-bottom:1.5rem;}
    .mb-2-1		{ margin-bottom:2rem;}
    .mb-3-1		{ margin-bottom:3rem;}
    .mb-3-2		{ margin-bottom:3rem;}
    .mb-4-2		{ margin-bottom:4rem;}
    .mb-5-2		{ margin-bottom:5rem;}

    .pd-2em     { padding-top:2em; padding-bottom:2em;}

@media only screen and (max-width: 1087px) {
    .pt-2-1		{ padding-top:1rem;}
    .pt-3-2		{ padding-top:2rem;}
    .pb-2-1		{ padding-bottom:1rem;}
    .pb-3-2		{ padding-bottom:2rem;}
    .pb-4-0		{ padding-bottom:0rem;}
    .pb-4-1		{ padding-bottom:2rem;}
    .pb-4-2		{ padding-bottom:3rem;}
    .pb-5-2		{ padding-bottom:2rem;}
    .mb15-1 	{ margin-bottom:1rem;}
    .mb-2-1		{ margin-bottom:1rem;}
    .mb-3-1		{ margin-bottom:1rem;}
    .mb-3-2		{ margin-bottom:2rem;}
    .mb-4-2		{ margin-bottom:3rem;}
    .mb-5-2		{ margin-bottom:2rem;}
    
    .tab-pd-2em { padding-top:2rem; padding-bottom:2rem; }
}
@media only screen and (max-width: 767px) {
    .pd-2em     { padding-left:.5em; padding-right:.5em;}
    
    .pb-4-1		{ padding-bottom:1rem;}
    .pb-4-2		{ padding-bottom:2rem;}
    .mb-4-2		{ margin-bottom:2rem;}
}

/*=================================================

		ページトップ

 ==================================================*/

#totop {
	display:none;
	*display:block; /* IE 7 and below */
	position:fixed;
	bottom:0px;
	right:0px;
	z-index:999;
	}
    :root *> #totop { display:none;	}
    #totop { display:block9; }
    *+html #totop { display:block; }
    #totop.open { display:block; }
    a.totop{ background: url("../images/parts/totop.jpg") no-repeat center top; background-size:cover;width:45px;height:90px;display:block;cursor:pointer;}
    a.totop:hover{ background-position:center bottom;}
@media only screen and (max-width: 767px) {
    #totop { bottom:40px; right:0;}
	a.totop{ background: url("../images/parts/totop-sp.png") no-repeat center top; background-size:cover;width:40px;height:40px;}
}