@charset "utf-8";

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

		style.css

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

.bg_red{
    background: #276d7a;
    overflow: hidden;
}
.bg_gray{
    background: #F9F9F9;
    overflow: hidden;
}
.bg_black{
    background: #333333;
    overflow: hidden;
}
.bg_white{
    background: #FFFFFF;
    overflow: hidden;
}

/*------------------------------
　赤のボタン
------------------------------*/
/* ボタン共通 */
.button {
	overflow: hidden;
	width: 234px;
	height: 64px;
	margin: 0;
	padding: 0;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
}
.button a {
	display: block;
	position: relative;
	z-index: 1;
	text-align:center;
	background: #276d7a;
	color: #FFFFFF;
	font-size: 1.4rem;
	line-height: 60px;
	text-decoration:none; 
    border:2px solid #276d7a;
}
.button a:hover {
  background-color: #FFFFFF;
  color: #276d7a;
}
.arrowNext a:before {
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 10px;
	width: 10px;
	height: 10px;
	margin-top: -4px;
	background: #FFFFFF;
}
.arrowNext a:after {
	display: block;
	content: "";
	position: absolute;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
	top: 50%;
	right: 13px;
	width: 10px;
	height: 10px;
	margin-top: -4px;
	background: #276d7a;
}
.arrowNext a:hover:before {
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	right: 10px;
	width: 10px;
	height: 10px;
	margin-top: -4px;
	background: #276d7a;
}
.arrowNext a:hover:after {
	display: block;
	content: "";
	position: absolute;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
	top: 50%;
	right: 13px;
	width: 10px;
	height: 10px;
	margin-top: -4px;
	background: #FFFFFF;
}
.arrowPrev a:before {
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 50%;
	left: 10px;
	width: 10px;
	height: 10px;
	margin-top: -4px;
	background: #FFFFFF;
}
.arrowPrev a:after {
	display: block;
	content: "";
	position: absolute;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
	top: 50%;
	left: 13px;
	width: 10px;
	height: 10px;
	margin-top: -4px;
	background: #276d7a;
}


/*------------------------------
	PC
------------------------------*/
@media print,screen and (min-width: 768px) {
    .spOnly{
        display: none !important;
    }
    .inner{
        width: 1000px;
        margin-left: auto;
        margin-right: auto;
    }
   } 
/*------------------------------
	SP
------------------------------*/
@media screen and (max-width:767px){
    img{
        width: 100%;
        height: auto;
    }
    .pcOnly{
        display: none !important;
    }
    .wrapper{
        margin-top: 50px;
    }
    .tel_link a{
        color: #FFFFFF;
    }
}

/*------------------------------
	h1 PC 大
------------------------------*/
@media screen and (min-width: 2001px) {
    h1.page_title{
        background: #276d7a;
        color: #FFFFFF;
        margin-top: 190px;
        width: 28.75%;
        line-height: 6.0rem;
        font-size: 6.3rem !important;
        font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
        font-weight: normal;
        padding-left: 18.75%;
        padding-top: 3.5rem;
        padding-bottom: 3.5rem;
    }
}
/*------------------------------
	h1 PC
------------------------------*/
@media print,screen and (min-width:768px) and ( max-width:2000px)  {
    h1.page_title{
        background: #276d7a;
        color: #FFFFFF;
        margin-top: 150px;/* 190px */
        width: 28.75%;
        line-height: 6.0rem;
        font-size: 3.6vw;
        font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
        font-weight: normal;
        padding-left: 18.75%;
        padding-right: 2%;
        padding-top: 2.5rem;/* 3.5em */
        padding-bottom: 2.5rem;/* 3.5em */
    }
}

/*------------------------------
	h1 SP
------------------------------*/
@media screen and (max-width:767px){
    h1.page_title{
        background: #276d7a;
        color: #FFFFFF;
        font-size: 8.0vw;
        font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
        font-weight: normal;
        padding-top: 2rem;
        padding-bottom: 2rem;
        padding-left: 1em;
        padding-right: 2em;
    }
}

/*------------------------------
	sub_page_tilte PC　大
------------------------------*/
@media screen and (min-width: 2001px) {
    .sub_page_tilte{
        font-family: 'Roboto Condensed', sans-serif;
        font-size: 18.0rem !important;;
        color: #D5D5D5;
        font-size: 8.8vw;
        position: absolute;
        top: 90px;
        right: 18.0%
    }
}

/*------------------------------
	sub_page_tilte PC
------------------------------*/
@media print,screen and (min-width:768px) and ( max-width:2000px)  {
    .sub_page_tilte{
        font-family: 'Roboto Condensed', sans-serif;
        font-size: 4.0vw;
        color: #D5D5D5;
        font-size: 8.8vw;
        position: absolute;
        top: 90px;
        right: 18.0%
    }
}
/*------------------------------
	sub_page_tilte SP
------------------------------*/
@media screen and (max-width:767px){
    .sub_page_tilte{
        font-family: 'Roboto Condensed', sans-serif;
        font-size: 3.0vw;
        color: #FFFFFF;
        font-size: 8.8vw;
        position: absolute;
        top: 0.5%;
        right: 5%
    }
}

/*------------------------------
	header PC
------------------------------*/
@media print,screen and (min-width: 768px) {
    header{
        height: 110px;
        width: 98%;
        /*position: fixed;*/
        z-index: 1000;
        background: rgba(255,255,255,0.7);
    }
    .site_description{
        font-size: 1.2rem;
        top: 30px;
        left: 35px;
        position: relative;
        z-index: 1;
    }
    .logo{
        position: relative;
        left: 35px;
        top: 35px;
        z-index: 1;
    }
    .logo a{
        background: url(../../common/img/logo.png) no-repeat;
        width: 279px;
        height: 55px;
        display: block;
        white-space: nowrap;
        overflow: hidden;
        text-indent: 100%;
    }
   .fixed {
        position: fixed;
        width: 100%;
        height: auto;
        z-index: 1000;
    }
    
    header .menu_panel .phone_panel{
        height: 76px;
        width: 350px;
        background: #276d7a;
        top: 0;
        right: 197px;
        position: absolute;
    }
    header .menu_panel .phone_panel li{
        color: #FFFFFF;
        float: left;
        font-size: 1.2rem;
        padding-top: 10px;
        padding-left: 18px;
    }
    header .menu_panel .phone_panel li span{
        font-size: 1.4rem;
        font-weight: 700;
        display: block;
        background: url(../../common/img/icn_tel.png) no-repeat left center;
        background-size: 15px 14px;
        padding-left: 20px;
    }
    header .menu_panel .member_button{
        top: 0;
        right: 115px;
        position: absolute;
    }
    .navToggle {
        top: 0;
        right: 35px;
        position: absolute;
        width:76px;
        height: 76px;
        background-image: url(../../common/img/menu_off.png);
        background-repeat: no-repeat;
        background-size: 76px;
        background-position: center center;
        cursor:pointer;
        z-index: 100;
    }
    .navToggle.open{
        background-image: url(../../common/img/menu_on.png);
    }
    .globalNavArea{
        background: #333333;
        width: 100%;
        display: none;
        z-index: 1000;
        position: relative;
        box-shadow:0px -10px 10px -1px #444444 inset;
        text-align: center;
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .globalNavArea p{
        color: #FFEA00;
        font-size: 1.2rem;
    }
    .globalNavArea ul{
        text-align: center;
        margin-top: 1rem;
        margin-bottom: 1rem;
    }
    .globalNavArea li{
        display: inline;
        font-size: 1.6rem;
        border-right: 1px solid #FFFFFF;
        padding-right: 1.5rem;
        padding-left: 1.0rem;
    }
    .globalNavArea li a {
        position: relative;
        display: inline-block;
        transition: .3s;
        color: #FFFFFF;
        text-decoration: none;
    }
    .globalNavArea li a::after {
        position: absolute;
        bottom: .2em;
        left: 0;
        content: '';
        width: 100%;
        height: 1px;
        background-color: #FFFFFF;
        opacity: 0;
        transition: .3s;
    }
    .globalNavArea li a:hover::after {
        bottom: 0;
        opacity: 1;
    }
    .globalNavArea li:last-child{
        border-right: none;
    }
}
/*------------------------------
	header SP
------------------------------*/
@media screen and (max-width:767px){
    header{
        height: 50px;
        width: 100%;
        position: fixed;
        z-index: 1000;
        background: rgba(255,255,255,1.0);
        top: 0;
        
    }
    .site_description{
        display: none
    }
    .logo{
        position: relative;
        left: 5px;
        top: 5px;
        z-index: 2000;
        width:50%;
    }
    .logo a{
        background: url(../../common/img/logo.png) no-repeat;
        background-size: contain;
        height: 40px;
        display: block;
        white-space: nowrap;
        overflow: hidden;
        text-indent: 100%;
    }
   .fixed {
        position: fixed;
        width: 100%;
        height: auto;
        z-index: 1000;
    }
    header .menu_panel .phone_panel{
        width: 100%;
        background: #276d7a;
        bottom: 0;
        left: 0;
        position: fixed;
        padding-top: 0.5em;
        padding-bottom: 0.5em;
    }
    header .menu_panel .phone_panel ul{
        padding-left: 3em;
    }
    header .menu_panel .phone_panel li{
        color: #FFFFFF;
        float: left;
        font-size: 3.4vw;
        width: 50%;
    }
    header .menu_panel .phone_panel li a{
        text-decoration: none;
    }
    header .menu_panel .phone_panel li span{
        font-size: 3.4vw;
        font-weight: 700;
        display: block;
        background: url(../../common/img/icn_tel.png) no-repeat left center;
        background-size: 15px 14px;
        padding-left: 20px;
    }
    header .menu_panel .member_button{
        top: 0;
        right: 13vw;
        position: fixed;
        width: 50px;
    }
    .navToggle {
        top: 0;
        right: 0;
        position: fixed;
        width:50px;
        height: 50px;
        background-image: url(../../common/img/menu_off.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center center;
        cursor:pointer;
        z-index: 100;
    }
    .navToggle.open{
        background-image: url(../../common/img/menu_on.png);
    }
    .globalNavArea{
        background: #333333;
        width: 100%;
        display: none;
        z-index: 1000;
        position: relative;
        box-shadow:0px -10px 10px -1px #444444 inset;
        top: 50px;
        padding-bottom: 2em;
    }
    .globalNavArea p{
        color: #FFEA00;
        font-size: 2.0vw;
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        padding-top: 2vw;
    }
    .globalNavArea ul{
        margin-bottom: 1em;
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        font-size: 0;
    }
    .globalNavArea li{
        font-size: 3.4vw;
        border-bottom: 1px solid #FFFFFF;
        line-height: 3;
        margin-right: 4%;
    }
    .globalNavArea li a{
        display: block;
        width: 100%;
    }
    
    .globalNavArea li:last-child{
        border-bottom: none;
    }
    .globalNavArea .member_btn{
        margin-top: 1em;
    }
    .globalNavArea .member_btn a{
        text-align: center;
        line-height: 3;
        background: #276d7a;
        color: #FFFFFF;
        width: 100%;
        display: block;
        font-size: 4.2vw;
        text-decoration: none;
    }
    .globalNavArea li a {
        position: relative;
        display: inline-block;
        transition: .3s;
        color: #FFFFFF;
        text-decoration: none;
    }
}



/*------------------------------
	footer PC
------------------------------*/
@media print,screen and (min-width: 768px) {
    #footer{
        background: #333333;
        width: 100%;
        color: #FFFFFF;
        margin-top: 8vw;
        overflow: hidden;
        padding-top: 3.5rem;
        padding-bottom: 2vw;
    }
    #footer .footer_contents{
        width: 1020px;
        margin-right: auto;
        margin-left: auto;
    }
    #footer .footer_contents .footer_description{
        color: #FFEA00;
        font-size: 1.4rem;
        padding-bottom: 1.0rem;
    }
    #footer .footer_contents .aboutBlock{
        width: 490px;
        float: left;
    }
    #footer .footer_contents .aboutBlock address{
        padding-top: 0rem;

        font-size:1.4rem;
    }
    
    #footer .footer_contents .sitemapBlock{
        width: 520px;
        float: right;
        border-left: 1px solid #FFFFFF;
    }
    #footer .footer_contents .sitemapBlock ul{
        margin-left: 10px;/* 30 → 10 */
    }
    #footer .footer_contents .sitemapBlock li{
        padding-right: 1rem;/* 1.2 → 1 */
        padding-left: 1rem;/* 1.2 → 1 */
        border-right: 1px solid #FFFFFF;
        margin-bottom: 1.0rem;
        display: inline-block;
    }
    #footer .footer_contents .sitemapBlock li:last-child{
        border-right: none;
        padding-right: 0;
    }
    #footer .footer_contents .sitemapBlock li a{
        color: #FFFFFF;
        text-decoration: none;
        font-size: 1.2rem;
        position: relative;
        display: inline-block;
        transition: .3s;
    }
    #footer .footer_contents .sitemapBlock li a::after {
        position: absolute;
        bottom: .2em;
        left: 0;
        content: '';
        width: 100%;
        height: 1px;
        background-color: #FFFFFF;
        opacity: 0;
        transition: .3s;
    }
    #footer .footer_contents .sitemapBlock li a:hover::after {
        bottom: 0;
        opacity: 1;
    }
    
    .copyright	{ font-size:12px; padding-top:20px; padding-left:40px; }
    .yellow		{ color:#ffe100; }
    
}    
/*------------------------------
	footer SP
------------------------------*/
@media screen and (max-width:767px){
    #footer{
        background: #333333;
        width: 100%;
        color: #FFFFFF;
        margin-top: 5vw;
        overflow: hidden;
        padding-top: 2rem;
        padding-bottom: 2vw;
    }
    #footer .footer_contents{
        width: 96%;
        margin-right: auto;
        margin-left: auto;
    }
    #footer .footer_contents .footer_description{
        color: #FFEA00;
        font-size: 3.0vw;
        padding-bottom: 2.0rem;
    }
    #footer .footer_contents .aboutBlock{
        width: 100%;
    }
    #footer .footer_contents .aboutBlock img{
        width: 50%;
    }
    #footer .footer_contents .aboutBlock address{
        padding-top: 1.0rem;
        padding-bottom: 1.0rem;
        text-align:center;
    }
    #footer .footer_contents .aboutBlock p{
        text-align: center;
        font-size: 2.6vw;
    }
    #footer .footer_contents .sitemapBlock{
        width: 100%;
        margin-top: 5vw;
        margin-bottom: 20vw;
    }
    #footer .footer_contents .sitemapBlock ul{
    }
    #footer .footer_contents .sitemapBlock li{
        padding-right: 0.3rem;
        padding-left: 0.3rem;
        margin-bottom: 0;
        display: inline-block;
    }
    #footer .footer_contents .sitemapBlock li{
        padding-right: 0.3rem;
        padding-left: 0.3rem;
        margin-bottom: 0;
        display: inline-block;
    }
    #footer .footer_contents .sitemapBlock li:last-child{
        border-right: none;
        padding-right: 0;
    }
    #footer .footer_contents .sitemapBlock li a{
        color: #FFFFFF;
        font-size: 2.6vw;
        position: relative;
        display: inline-block;
        transition: .3s;
    }
}

/*------------------------------
	FORM
------------------------------*/
/*  checkbox */

input[type=checkbox]{
  display: none;
}
input[type=radio]{
  display: none;
}
.checkbox-parts{
  padding-left: 20px;
  position:relative;
  margin-right: 20px;
}
.checkbox-parts::before{
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  border: 1px solid #666666;
  border-radius: 4px;
  background: #FFFFFF;
}
.checkbox-input:checked + .checkbox-parts::after{
  content: "";
  display: block;
  position: absolute;
  top: -5px;
  left: 5px;
  width: 7px;
  height: 14px;
  transform: rotate(40deg);
  border-bottom: 3px solid #276d7a;
  border-right: 3px solid #276d7a;
}
.radio-parts{
  padding-left: 20px;
  position:relative;
  margin-right: 20px;
}
.radio-parts::before{
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  border: 1px solid #666666;
  border-radius: 50px;
  background: #FFFFFF;
}
.radio-input:checked + .radio-parts::after{
  content: "";
  display: block;
  position: absolute;
  top: -5px;
  left: 5px;
  width: 7px;
  height: 14px;
  transform: rotate(40deg);
  border-bottom: 3px solid #276d7a;
  border-right: 3px solid #276d7a;
}



/*  text */
input[type="text"]{
  border: 1px solid #CECECE;
  width: 96%;
  padding-left: 2%;
  padding-right: 2%;
  padding-top: 1.0rem;
  padding-bottom: 1.0rem;
  font-size: 1.6rem;
}
input[type="email"]{
  border: 1px solid #CECECE;
  width: 96%;
  padding-left: 2%;
  padding-right: 2%;
  padding-top: 1.0rem;
  padding-bottom: 1.0rem;
  font-size: 1.6rem;
}
input.inputS{
    width: 15% !important;
}
select{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 0;
    margin: 0;
    height: 30px;
    background:transparent;
    position: relative;
    z-index: 1;
    padding: 0 40px 0 10px;
    border: 1px solid #ccc;
}
select::-ms-expand {
    display: none;
}
.selectWrap{
    position: relative;
    display: inline-block;
    background: #FFFFFF;
}
.selectWrap::before{
    content: '';
    position: absolute;
    z-index: 0;
    top: 0;
    right: 0;
    background: #ccc;
    height: 100%;
    width: 30px;
}
.selectWrap::after{
    content: '';
    position: absolute;
    z-index: 0;
    top: 0;
    bottom: 0;
    margin: auto 0;
    right: 9px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 6px 0 6px;
    border-color: #FFFFFF transparent transparent transparent; 
}
textarea {  
  border: 1px solid #CECECE;
  width: 94%;
  padding-left: 2%;
  padding-right: 2%;
  padding-top: 1.0rem;
  padding-bottom: 1.0rem;
}