@charset "UTF-8";

/*-------------------------
__base_style
-------------------------*/
body {
font-family:'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','游ゴシック Medium','Yu Gothic Medium','游ゴシック体',YuGothic,'メイリオ','Meiryo','ＭＳ Ｐゴシック','MS PGothic',sans-serif;
-moz-osx-font-smoothing: auto | grayscale // Firefox
-webkit-font-smoothing: antialiased;
}
#wrap {
position: relative;
overflow: hidden;
}
#content {
border-bottom: 1px solid #DDD;
}

#page_title {
height: 180px;
width: 100%;
margin: 0 0 60px;
position: relative;
}
#page_title:after {
content: "";
display: block;
height: 180px;
width: 100%;
background:url(../images/bg_pattern.png) repeat 0 0;
position: absolute;
left: 0;
right: 0;
}
#page_title h1 {
font-size: 3em;
font-weight: 700;
color: #FFF;
position: absolute;
right: 0;
left: 0;
top: 50%;
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 1;
}
#page_title h1 span {
font-size: 70%;
font-weight: 400;
letter-spacing: 0.04em;
display: block;
margin: 1em 0 0;
}
@media screen and (max-width: 767px) {
#page_title {
height: 120px;
margin: 0 0 30px;
}
#page_title:after {
height: 120px;
}
#page_title h1 {
font-size: 1.8em;
text-align: left;
right: 10px;
left: 10px;
top: 50%;
}
#page_title h1 span {
margin: 0.75em 0 0;
}
}

.block_title {
font-size: 2.4em;
line-height: 1.4;
font-weight: 700;
padding: 0 0 40px;
}
.block_title:before,
.block_title:after {
content: "";
display: inline-block;
vertical-align: middle;
background-color: #000;
height: 2px;
width: 30px;
margin: -2px 0.5em 2px;
}
@media screen and (max-width: 767px) {
.block_title {
font-size: 1.8em;
padding: 0 0 30px;
}
.block_title:before,
.block_title:after {
width: 20px;
}
}

.sp_br {
display: none!important;
}
.pc_hd {
display: none!important;
}
@media screen and (max-width: 767px) {
.pc_hd {
display: block!important;
}
.sp_hd {
display: none!important;
}
.pc_br {
display: none!important;
}
.sp_br {
display: inline!important;
}
}

/*-------------------------
__header
-------------------------*/
#header {
height: 80px;
position: relative;
}
#header .header_inner {
padding: 17px 0;
margin: 0 15px;
zoom: 1;
}
#header .header_inner:after {
content: "";
display: block;
clear: both;
}
#header #logo {
float: left;
width: 439px;
}
#header #logo picture,
#header #logo img {
height: auto;
width: 100%;
}
#header .contact_btn {
font-size: 1.8em;
line-height: 46px;
font-weight: 700;
color: #1A165A;
letter-spacing: 0.04em;
width: 240px;
float: right;
}
#header .contact_btn a {
display: block;
color: #FFF;
text-decoration: none;
display: block;
background-color: #E45D35;
height: 46px;
box-sizing: border-box;
-webkit-transition: .3s;
-ms-transition: .3s;
transition: .3s;
}
@media screen and (min-width: 961px) {
#header .contact_btn a:hover {
filter: alpha(opacity=80);
opacity: 0.8;
}
}
@media screen and (max-width: 767px) {
#header {
height: auto;
}
#header .header_inner {
margin: 0 42px 0 0;
padding: 10px 0;
border-right: 1px solid #DDD;
}
#header #logo {
width: auto;
margin: 0 10px;
padding: 0 0 6px;
float: none;
}
#header #logo picture,
#header #logo img {
max-width: 439px;
}
#header .contact_btn {
font-size: 1.4em;
line-height: 30px;
width: auto;
margin: 0 10px;
float: none;
}
#header .contact_btn a {
height: 30px;
}
#header .contact_btn a:after {
height: 14px;
width: 14px;
}
#header .toggle_btn {width: 42px;display: block;position: absolute;right: 0;top: 50%;cursor: pointer;}
#header .toggle_btn:before {content: "";display: block;background-color: #898989;height: 2px;width: 20px;position: absolute;left: 10px;top: 50%;-webkit-transition: all .3s;-ms-transition: all .3s;transition: all .3s;transform: rotate(0deg);}
#header .toggle_btn a:before,
#header .toggle_btn a:after{content: "";display: block;background-color: #898989;height: 2px;width: 20px;position: absolute;left: 10px;top: 50%;-webkit-transition: all .3s;-ms-transition: all .3s;transition: all .3s;}
#header .toggle_btn a:before{transform: translateY(-8px);}
#header .toggle_btn a:after{transform: translateY(8px);}
#header .toggle_btn.active:before {transform: rotate(-45deg) translateY(0px);}
#header .toggle_btn.active a:before{background: rgba(255, 255, 255, 0);}
#header .toggle_btn.active a:after{transform: rotate(45deg) translateY(0px);}
}

/*-------------------------
__navi
-------------------------*/
#navi {
background-color: #0E1E5C;
}
#navi ul {
width: 960px;
margin: 0 auto;
}
#navi li {
font-size: 2em;
line-height: 60px;
font-weight: 700;
color: #FFF;
vertical-align: top;
display: inline-block;
width: 20%;
}
#navi li:nth-of-type(1) {
width: 14%;
}
#navi li:nth-of-type(2) {
width: 28%;
}
#navi li:nth-of-type(3) {
width: 16%;
}
#navi li:nth-of-type(4) {
width: 17%;
}
#navi li:nth-of-type(5) {
width: 25%;
}
#navi li a {
color: #FFF;
text-decoration: none;
display: block;
-webkit-transition: .3s;
-ms-transition: .3s;
transition: .3s;
}
@media screen and (min-width: 961px) {
#navi li a:hover {
background-color: #999;
}
}
@media screen and (max-width: 960px) {
#navi ul {
text-align: left;
width: auto;
margin: 0;
padding: 8px 0;
}
#navi li,
#navi li:nth-of-type(1),
#navi li:nth-of-type(2),
#navi li:nth-of-type(3),
#navi li:nth-of-type(4),
#navi li:nth-of-type(5) {
text-align: center;
width: 50%;
line-height: 1.8em;
}
}
@media screen and (max-width: 767px) {
#navi {
display: none;
position: absolute;
left: 0;
right: 0;
top: 0;
margin: 0;
z-index:100;
}
#navi ul {
width: auto;
padding: 0;
}
#navi li,
#navi li:nth-of-type(1),
#navi li:nth-of-type(2),
#navi li:nth-of-type(3),
#navi li:nth-of-type(4),
#navi li:nth-of-type(5) {
font-size: 1.3em;
line-height: 1.4em;
font-weight: 700;
color: #FFF;
display: block;
width: auto;
}
#navi li a {
color: #FFF;
padding: 10px 0;
border-top: 1px solid #DDD;
}
}

/*-------------------------
__member
-------------------------*/
#member {
padding: 60px 0 20px;
}
#member ul {
text-align: left;
width: 960px;
margin: 0 auto;
}
#member li {
text-align: center;
display: inline-block;
width: 25%;
padding: 0 0 40px;
}
#member li a img {
-webkit-transition: .3s;
-ms-transition: .3s;
transition: .3s;
}
@media screen and (min-width: 961px) {
#member li a:hover img {
opacity: 0.7;
}
}
@media screen and (max-width: 960px) {
#member ul {
width: auto;
margin: 0;
}
#member li {
width: 33.333%;
padding: 0 0 30px;
}
}
@media screen and (max-width: 767px) {
#member {
padding: 30px 0 15px;
}
#member li {
width: 50%;
padding: 0 0 25px;
}
#member li a img {
height: 42px;
width: auto;
}
}

/*-------------------------
__footer
-------------------------*/
.page_top a {
display: block;
background-color: #0E1E5C;
padding: 9px 0;
}
#footer {
background-color: #FFF;
border-top: 1px solid #CCC;
}
#footer .footer_inner {
width: 960px;
margin: 0 auto;
padding: 50px 0 70px;
zoom: 1;
}
#footer .footer_inner:after {
content: "";
display: block;
clear: both;
}
#footer .footer_navi_box {
width: 530px;
float: right;
}
#footer .footer_navi_box ul {
display: inline-block;
vertical-align: top;
text-align: left;
padding: 0 15px;
box-sizing: border-box;
}
#footer .footer_navi_box ul:nth-of-type(1) {
width: 340px;
border-left: 1px dotted #CCC;
border-right: 1px dotted #CCC;
}
#footer .footer_navi_box ul:nth-of-type(2) {
width: 180px;
}
#footer .footer_navi_box li {
font-size: 1.8em;
line-height: 2.2;
}
#footer .footer_navi_box li a {
color: #000;
text-decoration: none;
-webkit-transition: .3s;
-ms-transition: .3s;
transition: .3s;
}
@media screen and (min-width: 961px) {
#footer .footer_navi_box li a:hover {
color: #06C;
}
}
#footer .footer_info_box {
width: 350px;
float: left;
}
#footer .footer_info_box .footer_logo {
padding: 0 0 20px;
}
#footer .footer_info_box .footer_logo picture,
#footer .footer_info_box .footer_logo img{
height: auto;
width: 100%;
}
#footer .footer_info_box .contact_btn {
font-size: 1.8em;
line-height: 38px;
font-weight: 700;
color: #1A165A;
letter-spacing: 0.04em;
width: 350px;
}
#footer .footer_info_box .contact_btn a {
display: block;
color: #FFF;
text-decoration: none;
display: block;
background-color: #E45D35;
height: 38px;
-webkit-transition: .3s;
-ms-transition: .3s;
transition: .3s;
}
@media screen and (min-width: 961px) {
#footer .footer_info_box .contact_btn a:hover {
filter: alpha(opacity=80);
opacity: 0.8;
}
}
#footer .copyright {
font-size: 1.6em;
text-align: left;
width: 960px;
margin: 0 auto;
padding: 0 0 30px;
}
@media screen and (max-width: 1000px) {
#footer .footer_inner {
width: auto;
margin: 0 20px;
}
#footer .footer_navi_box {
width: auto;
float: none;
padding: 0 0 40px;
}
#footer .footer_navi_box ul:nth-of-type(1) {
width: 50%;
}
#footer .footer_navi_box ul:nth-of-type(2) {
width: 50%;
}
#footer .footer_info_box {
width: auto;
float: none;
}
#footer .footer_info_box .footer_logo {
width: 350px;
margin: 0 auto;
}
#footer .footer_info_box .contact_btn {
margin: 0 auto;
}
#footer .copyright {
width: auto;
text-align: center;
margin: 0 10px;
}
}
@media screen and (max-width: 767px) {
.page_top a {
padding: 6px 0;
}
#footer .footer_inner {
margin: 0 10px;
padding: 15px 0 30px;
}
#footer .footer_navi_box {
padding: 0 0 20px;
}
#footer .footer_navi_box ul {
display: block;
padding: 0;
}
#footer .footer_navi_box ul:nth-of-type(1),
#footer .footer_navi_box ul:nth-of-type(2){
width: auto;
border-left: none;
border-right: none;
}
#footer .footer_navi_box li {
font-size: 1.4em;
line-height: 1.8;
}
#footer .footer_info_box .footer_logo {
width: auto;
max-width: 350px;
margin: 0 auto;
}
#footer .footer_info_box .contact_btn {
font-size: 1.4em;
line-height: 30px;
width: auto;
float: none;
}
#footer .footer_info_box .contact_btn a {
height: 30px;
}
#footer .footer_info_box .contact_btn a:after {
height: 14px;
width: 14px;
}
#footer .copyright {
font-size: 1em;
width: auto;
margin: 0 10px;
padding: 0 0 15px;
}
}
