/* HTML初期化 */
body {
line-height: 1;
margin: 0;
padding: 0;
zoom:1
}


h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
font-weight:normal;
font-style:normal;
}

p, dl, dt, dd, em, form, address,ul,li {
margin: 0;
padding: 0;
font-style:normal;
}

/* HTML5用 */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}

fieldset {
border:0;
margin: 0;
padding: 0;
}

hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #cccccc;
margin: 1em 0;
padding: 0;
}

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

li {
padding: 0;
margin: 0;
}

input, select {
vertical-align: middle;
}

/* tableタグ*/
th,td{
padding:0;
}

caption{
text-align:left;
} 


/* リンク設定 */
a {
outline:0;
border:0;
transition: all 0.3s ease;
}

@media screen and (max-width: 800px) {
a {
transition:none !important;
}
}

a img {
border:0;
}

img {
border:0;
max-width:100%;
-webkit-backface-visibility: hidden;
}

html {
-webkit-text-size-adjust: none;
zoom:1;
}

body,html {
height:100%;
}


/*============================================
基本CSS
===========================================*/
html {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
font-size: 100px;
-webkit-font-smoothing: antialiased;
}

@media screen and (max-width: 1200px) {
html {
-ms-text-size-adjust: 94%;
-webkit-text-size-adjust:94%;
font-size:94px;
-webkit-font-smoothing: antialiased;
}
}

body {
font-family: AppleSystem, 'ヒラギノ角ゴシック','Hiragino Sans','メイリオ', Meiryo,sans-serif;
-webkit-font-feature-settings: "palt" 1;
font-feature-settings: "palt" 1;
}

/* ゴシックフォント */
.gothic {
font-family: 'Roboto', AppleSystem, 'ヒラギノ角ゴシック','Hiragino Sans','メイリオ', Meiryo,sans-serif;
}
@font-face {
    font-family: 'gotham';
    src: url("../font/gotham_medium.ttf");
}
#contents_wrapper {
max-width: 1200px;
margin: auto;
background: #FFF;
min-height: 100%;
position: relative;
overflow: hidden;
box-shadow: 0 0 3px rgba(0,0,0,0.1);
}

/* インナーボックス : 1100px */
.inner_box {
max-width: 1000px;
margin: auto;
padding-left: 0.3rem;
padding-right: 0.3rem;
position: relative;
}

/* flexbox */
.flex_box {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

/* コンテナー */
.container {
    width: 1100px;
    margin: 0 auto;
    box-sizing: border-box;
}
@media screen and (min-width:768px) and ( max-width:1024px){
    /* コンテナー */
    .container {
        width: 100%;
        padding-left: 0.15rem;
        padding-right: 0.15rem;
    }
}
@media screen and (max-width: 767px) {
    .container {
        width: 100%;
        padding-left: 0.2rem;
        padding-right: 0.2rem;
    }
}

header {
position: relative;
z-index: 10;
}

.sp_only {display: none;}
@media screen and (max-width: 767px) {
.sp_only {display: block;}
.pc_only {display: none;}
}

/*============================================
ナビゲーション
===========================================*/
.header_container {
	margin-right: 5%;
}

.header_container .flex_box {
	justify-content: flex-end;
}
/*ナビゲーション*/
#main_navi {
/*
    max-width: 7rem;
    width: 100%;
*/
margin-left: auto;
}

@media screen and (min-width: 768px) {
#main_navi ul {
display: flex !important;
}
}

#main_navi li {
    font-size: 0.18rem;
/*    width: 16%;*/
    text-align: center;
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
    box-sizing: border-box;
}
/*snsナビ*/
#main_navi li:last-child {
    padding-top: 0.35rem;
	padding-left: .1rem;
}
#main_navi li a {
    display: inline-block;
    text-decoration: none;
    font-family: 'Noto Serif JP', serif;
    color: #000;
    border-right: 1px dotted #c1272d;
    box-sizing: border-box;
    padding-right: .2rem;
	padding-left: .16rem;
}

@media screen and (max-width: 1024px) {
#main_navi li a {
    padding-right: .1rem;
	padding-left: .06rem;
}
}

@media screen and (max-width: 767px) {
#main_navi li a {
    padding-right: 0;
}
}

#main_navi li.menu_sns a {
    padding-right: 0.1rem;
    border: none;
}

@media screen and (max-width: 800px) {
#main_navi li.menu_sns a {
width: .4rem;
}
}

@media screen and (min-width:768px) and ( max-width:1024px){
    #main_navi {
        width: calc(100% - 2rem);
    }
    #main_navi .flex_box {
        display: flex!important;
    }
    #main_navi li {
        font-size: 0.14rem;
    }
}
@media screen and (max-width: 767px) {
    header h1 {
        width: 40%;
        padding-left: 0.1rem;
    }
    #main_navi ul {
        position: absolute;
        top: 48px;
        right: inherit;
        left: 0;
        width: 100%;
        display: none;
        z-index: 100;
    }
    header .container {
        padding: 0;
    }
    #main_navi {
        width: 100%;
        padding-top: 0;
    }
    #main_navi li {
        padding: 0;
        margin-left: 0;
        width: 100%;
        background:#fff;
    }
    #main_navi li a {
        padding-top: 15px;
        padding-bottom: 15px;
        border-right: none;
    }
    /*snsナビ*/
    #main_navi li:last-child {
        padding-top: 0.2rem;
		padding-bottom: 0.4rem;
    }
}
/*============================================
スマホナビ
===========================================*/
#SP_navi_wrapper {
display: none;
}
@media screen and (max-width: 767px) {
    header {
        position: fixed;
        width: 100%;
        background: #fff;
        z-index: 9999;
        height: 0.55rem;
    }
    /*スマホボタン*/
    #SPnaviBtn {
        width: 50px;
        height: 44px;
        position: absolute;
        text-align: center;
        z-index: 1000;
        top: 54%;
        right: 0;
        transform: translateY(-50%);
        cursor: pointer;
    }
    #SPmenuBars {
        position: absolute;
        left: 50%;
        width: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
    }
    .menu-trigger span {
        position: absolute;
        left: 0;
        width: 100%;
        height: 2px;
        background-color: #000;
    }
    .menu-trigger span:nth-of-type(1) {
        top: 10px;
    }
    .menu-trigger span:nth-of-type(2) {
        top: 20px;
    }
    .menu-trigger span:nth-of-type(3) {
        top: 30px;
    }
    .menu-trigger.active span {
        position: absolute;
        left: 0;
        width: 100%;
        height: 2px;
    }
    .menu-trigger.active span:nth-of-type(1) {
        -webkit-transform: translateY(10px) rotate(-45deg);
        transform: translateY(10px) rotate(-45deg);
        top: 10px;
    }
    .menu-trigger.active span:nth-of-type(2) {
        opacity: 0;
    }
    .menu-trigger.active span:nth-of-type(3) {
        -webkit-transform: translateY(-5px) rotate(45deg);
        transform: translateY(-5px) rotate(45deg);
        top: 25px;
    }
    #SPnaviBtn {
        display: block;
    }

}

/*============================================
下層共通
===========================================*/
h2 {
    line-height: 0;
    font-size: initial;
}
#underpage_title {
    background: #f2f2f2;
    line-height: 0;
    margin-bottom: 40px;
}
#underpage_title h2 {
    display: inline-block;
    background: #fff;
    padding: 50px;
}
@media screen and (max-width: 767px) {
    #underpage_title {
        margin-top: 45px;
        margin-bottom: 20px;
    }
    #underpage_title h2 {
        padding: 25px ;
    }
}
/*============================================
コンテンツ基本
===========================================*/
/*
.inner_box h2 {
font-size: 0.2rem;
padding-bottom: 0.2rem;
}

.inner_box .text_center {
text-align: center;
}

.inner_box h2 strong.left_border {
background: url("../img/title_border.png") no-repeat right;
background-size: 0.2rem;
padding-right: 0.24rem;
letter-spacing: 0.01rem;
}

.inner_box h2 strong.both_border {
letter-spacing: 0.01rem;
}

.inner_box h2 strong.both_border img {
width: 0.2rem;
padding-left: 0.06rem;
padding-right: 0.06rem;
vertical-align: middle;
}

.inner_box h2 span {
display: inline-block;
font-size: 0.14rem;
padding-left: 0.2rem;
position: relative;
top:-0.04rem;
font-family: 'Roboto', AppleSystem, 'ヒラギノ角ゴシック','Hiragino Sans','メイリオ', Meiryo,sans-serif;
}
*/


/*======================
フッター
======================*/
footer {
text-align: center;
background: #000;
line-height: 0;
padding-top: 0.5rem;
}

@media screen and (max-width: 767px) {
footer {
padding-top: 0.3rem;
}
}

/*コピーライト*/
.copyright {
padding-top: 0.3rem;
padding-bottom: 0.5rem;
text-align: center;
font-family: 'Roboto', sans-serif;
font-size: 0.12rem;
color: #fff;
}

@media screen and (max-width: 767px) {
.copyright {
padding-bottom: 0.3rem;
}
}

footer img {
height: 0.4rem;
}

@media screen and (max-width: 767px) {
footer img {
height: 0.3rem;
}
}