@charset "utf-8";

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

layout Set

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

/* Header
----------------------------------------------- */
header {
width: 100%;
padding: 0 0 0;
z-index: 100;
position: relative;
line-height: 1.5;
border-top: 10px solid #1e257c;
background: #fff;
overflow: hidden;
}
hgroup {
width: 100%;
margin: 0 auto;
padding: 0;
position: relative;
}
header .itemleft{
float: left;
margin: 10px 0 ;
max-width: 48%;
}

/* ロゴ */
header .logo {
margin-left: 10px;
}
header .logo a {color: #333;}

/* ヘッダーレスポンス */
#headerResponse{
float: right;
width: 48%;
position: relative;
margin: 10px 0 ;
}
#headerResponse ul {
margin: 0 0 0;
padding: 0;
text-align: right;
}
#headerResponse ul li{
margin: 0;
display: inline-block;
vertical-align: top;
}
#headerResponse ul li.tel{
margin: 0 2% 0 ;
}
#headerResponse ul li.btn{
display: none;
}

/* 768px～ Header用メディアクエリ開始 */
@media screen and (min-width : 768px) {
header {
font-size: 0.75em;
}
/* ロゴ */
header .logo {
font-size: 1em;
padding: 0 0 0 ;
height: auto;
}
header .itemleft{
max-width: 48%;
margin: 20px 0 ;
}
#headerResponse{
width: 48%;
margin: 20px 0 ;
}
}

/* 728px以下スクロール用 */
@media screen and (max-width : 768px) {
/* End 728px以下スクロール用 */
}
/* 1024px～ Header用メディアクエリ開始 */
@media screen and (min-width : 1024px) {
/* ヘッダー */
header {
}
hgroup {
width: 1000px;
margin: 0 auto;
}

header .itemleft{
float: left;
max-width: 100%;
margin-left: 0;
}
/* ロゴ */
header .logo {
max-width: 100%;
height: auto;
}

/* ヘッダーレスポンス */
#headerResponse{
width: auto;
}
#headerResponse ul {
}
#headerResponse ul li{
}
#headerResponse ul li.tel{
margin: 0 20px 0 0;
max-width: 100%;
}
#headerResponse ul li.btn{
margin: 0 0 0 0;
max-width: 100%;
}
}
/* END Header
----------------------------------------------- */


/* ヘッダーキャンペン */
#headercode{
width: 100%;
margin: 0 auto;
text-align : center;
background: url(../images/common/header_code_bg.png) repeat center top;
color: #fff;
padding: 0.7em 0 1em;
}
#headercode p{
font-size: 1em;
margin-bottom: 0;
}
#headercode p span.em{
font-size: 1.5em;
color: #fff100;
}
#headercode ul li{
text-align : center;
display: inline-block;
margin: 0.7em 0.5em 0;
height: 30px;
}

/* ヘッドライン */
#headline {
width: 100%;
margin: 0 auto;
text-align : center;
}
#headline .wrap{
text-align : center;
padding: 20px 2% 20px;
}
#headline .wrap img{
padding: 0 0 1em;
}
#headline .bg-slider{
background-position:center center;
background-size: cover;
display: flex;
align-items: center;
justify-content: center;
}

/* コンテンツ枠 */
#contents {
width : 100%;
margin : 20px auto 0;
}

/* メインコンテンツ */
section{
width : 100%;
margin : 20px auto;
}
.inner{
width: 94%;
margin: 0 auto;
}

section#topcampaign .frame{
background: #1e257c;
padding: 18px;
border: 7px solid #cfc191;
border-radius: 20px;
margin: 0 0 20px;
text-align: center;
}
section#topcampaign .frame.bk{
background: #221715;
}

section#hinkmoku h3 img{
max-width: 60%;
}
section#hinkmoku{
background: #1e257c;
padding: 1em 0;
margin-bottom: 0;
}
#hinkmoku .hinkmokulist{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#hinkmoku .hinkmokulist li{
width: 32%;
text-align: center;
color: #fff;
margin: 0 0 1.5em;
font-size: 0.9em;
line-height: 1.3;
}
#hinkmoku .hinkmokulist li img{
margin: 0 0 0.5em;
max-width: 96%;
}

section#jisseki{
background: url(../images/contents/jisseki_bg.jpg) repeat center top;
padding: 1em 0;
margin-top: 0;
}
#jisseki h4{
text-align: center;
font-size: 1.4em;
color: #bf0008;
}

#jisseki .jissekilist{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 660px;
}
.scroll{
margin-bottom: 20px;
padding: 0 0 10px;
overflow: auto;  /*tableをスクロールさせる*/
}
.scroll::-webkit-scrollbar{ /*tableにスクロールバーを追加*/
height: 20px;
}
.scroll::-webkit-scrollbar-track{ /*tableにスクロールバーを追加*/
background: #fff;
}
.scroll::-webkit-scrollbar-thumb { /*tableにスクロールバーを追加*/
background: #aaa;
}

#jisseki .jissekilist li{
width: 24%;
text-align: center;
color: #fff;
margin: 0 0 0;
font-size: 1.2em;
font-weight: bold;
}
#jisseki .jissekilist li img{
margin: 0 0 0.5em;
max-width: 96%;
}

.response {
margin-bottom: 40px;
}
.response h3 {
margin-bottom: 0.5em;
}

#reason{
background: url(../images/contents/section03_bg.jpg) no-repeat center top;
background-size: cover;
padding: 30px 0 20px;
}
#reason h3{
margin-bottom: 0.5em;
}
#reason .reasonlist li{
margin-bottom: 20px;
}

#faq h3 img,#contact h3 img,#access h3 img{
max-width: 60%;
}

#contact h3{
background: #1e257c;
padding: 0.5em 1em 1em;
}

#access h3{
background: #1e257c;
padding: 0.5em 1em 1em;
}
#access h3 img{
max-width: 80%;
}
#access h4{
color: #1e257c;
}
#access .layout2 .itemleft{
background: #1e257c;
padding: 1em 1em ;
color: #fff;
}
#access .layout2 .itemleft h4{
color: #fff;
}
#access .layout2 .itemleft a{
color: #fff;
}
.sns-list li{
display: inline;
margin: 0 1em 0 0 ;
}
.access-list li  {
margin: 0 0 2em 0 ;
}
.access-list li img {
display: block;
margin: 0 auto 0;
}
.access-list li span {
color: #1e257c;
font-size: 2em;
margin: 0 8px 0 0;
vertical-align: sub;
}


/* フッター */
#pagetop{
position: fixed;
bottom: 90px;
right: 10px;
}
#pagetop img{
width: 50px;
}

#fixed{
position: fixed;
bottom: 0px;
}

footer {
padding : 30px 0 120px;
margin: 0 0 0;
background: #1e257c;
color: #fff;
line-height: 1.5;
overflow: hidden;
}
footer .footerlogo {
margin: 0 0 30px;
height: 60px;
}
footer .inner {
width: 90%;
margin: 0 auto;
}
footer a {color: #fff; text-decoration: none;}
footer a:visited { color: #fff; }
footer a:hover { color: #fff; text-decoration: underline;}

#footernav {
}
#footernav li {
}
#footernav li::before {
font-family: "fontawesome";
content: '\f0da';
margin-right: 0.5em;
}

footer .copy {
text-align: center;
margin: 2em 0 0;
}

/* フォーム */
.optin{
text-align: center;
background: url(../images/contents/response_bg.jpg) no-repeat center top;
background-size: cover;
padding: 5px 0 20px;
text-align: center;
}
.optin .btn{
  margin: 1em 0;
}

.law section{
font-size: 0.9em;
line-height: 1.5;
}
.law section .inner{
width: 90%;
}

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

Media Queries

----------------------------------------------------------------*/
/* 768px～ メディアクエリ開始 */
@media screen and (min-width : 768px) {
/* ヘッダー */
header {
text-align: left;
margin: 0;
}
/* ヘッダーキャンペン */
#headercode{
padding: 0.8em 0 1em;
}
#headercode p{
font-size: 1.1em;
}

/* ヘッダー（見出し・画像）枠 */
#headline {
margin: 0 auto;
text-align : center;
background: url(../images/contents/mv_bg02.jpg) repeat-x center top;
background-size: cover;
}
#headline .wrap{
padding: 150px 2% 130px;
}
#headline .wrap img{
padding: 0 0 1em;
}

/* メインコンテンツ */
#contents {
width: 100%;
}
#main {
margin: 40px auto 0;
}
section{
margin : 40px auto;
}
section p{
}

section#topcampaign .frame{
padding: 30px;
border: 10px solid #cfc191;
margin: 0 0 50px;
}

#hinkmoku .hinkmokulist li{
font-size: 1.2em;
}
#jisseki h4{
font-size: 1.8em;
}
#jisseki .jissekilist{
width: auto;
}
.response {
margin-bottom: 60px;
}
#reason h3{
margin-bottom: 1em;
}
#reason .reasonlist li{
margin-bottom: 30px;
}
#access .layout2 .itemleft{
width: 46%
}
#access .layout2 .itemright{
width: 46%
}

#access .access-list{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#access .access-list li{
width: 31%;
margin: 0 0 1.5em;
}
#access .access-list li img{
margin: 0 0 0.5em;
max-width: 100%;
}
#access .access-list li span {
font-size: 2em;
margin: 0 8px 0 0;
line-height: 1;
}

/* フッター */
#pagetop{
bottom: 10px;
right: 10px;
}

#fixed{display: none;}

footer {
padding : 30px 0 30px;
}

footer .footerlogo {
margin: 0 0 30px;
height: 60px;
}
#footernav {
  text-align: center;
}
#footernav::before {
content: "　|　";
}
#footernav li {
display: inline;
}
#footernav li::before {
content: none;
}
#footernav li::after {
content: "　|　";
}
footer .copy {
margin: 20px 0 0 ;
}

}
/* 1024px～ メディアクエリ開始 */
@media screen and (min-width : 1024px) {
/* ヘッダーキャンペン */
#headercode{
padding: 1em 0 1.5em;
}
#headercode p{
font-size: 1.3em;
}
#headercode ul li{
margin: 1em 0.5em 0;
height: 40px;
}

#headline{
background-size: auto;
}

#headline .wrap{
padding: 170px 2%;
}

/* メインコンテンツ内部 */
.inner{
width: 1000px;
margin: 0 auto;
}
.inner.w980{
width: 980px;
margin: 0 auto;
}
section{
margin : 50px auto;
}

#jisseki .inner{
width: 920px;
}
#contact .inner{
width: 760px;
}
#access{
margin: 50px 0;
font-size: 1.2em;
line-height: 2;
}


/* フッター */
#pagetop{
bottom: 20px;
right: 20px;
}
footer {
padding : 40px 0 40px;
}
footer .inner {
width: 90%;
margin: 0 auto;
}

.optin{
padding: 50px 0;
}
.optin h3{
margin: 0;
}



} /* 1024px～ メディアクエリ終了 */