@charset "utf-8";
/* CSS Document */

/*
緑      #00947E
薄緑    #EDF9F7
#D6F8D6
#EAFDF8
#F0B67F
*/

body {
}
a {}

/*
a:hover img {
opacity:0.7;
}
*/

/* android 文字サイズバグ対策 */
TABLE TD{ max-height: 999999px!important;}

P {    text-align: justify;}

a img {
  -webkit-filter: grayscale(0);
  filter: grayscale(0);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}
a:hover img {
/*    
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
  */  
 filter: saturate(150%);
    opacity: 0.8;
}


h1,h2,h3 {
	font-weight: bold;
}


H1 {
	height: 2.8em;
	padding-top: 17px;
	font-size: 32px;
	color: #FFFFFF;
}

.h1h {
    height: 14px;
    padding-top: 3px;
    font-weight: 500;
    color: #FFFFFF;
    text-align: center;
    margin-top: 2px;
    margin-bottom: 4px;
    padding-bottom: 3px;
    font-size: 12px;
}

@media (min-width: 992px) {
.h1h {
	margin-right: 3px;
	font-size: 12px;
	text-align: right;
}
}
@media (min-width: 400px) and (max-width: 480px) {
.h1h {	font-size: 11px;}
}
@media (min-width: 365px) and (max-width: 399px) {
.h1h {	font-size: 10px;}
}
@media (max-width: 364px) {
.h1h {	font-size: 9px;}
}

H2 {
    font-family: "游明朝","Hiragino Mincho ProN","游ゴシック",  "メイリオ", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",  Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    height: 3.2em;
    padding-top: 25px;
    font-size: 26px;
    background-image: url(../images/listen.png);
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 23px;
    margin-bottom: 15px;
}
.bk_head {
    margin-bottom: 60px;
}
.bk_head H2 {
    padding-left: 0px;
    background-image: none;
    font-size: 32px;
    letter-spacing: 0.1em;
    color: #00489d;
    font-weight: bold;
    border-top: 3px solid #00489D;
    border-bottom: 3px solid #00489D;
    margin-top: 0px;
    padding-top: 40px; 
	height: 100%;
    padding-bottom: 40px;    
}

@media (max-width: 480px) {
H2.h2f30 {font-size: 30px!important;
    letter-spacing: 0em;
    }
    
H2  {
	padding-top: 22px;
	height: 3.6em;
	font-size: 22px;
}
H2.kaigyo {	height: 3.6em; 
	padding-top: 15px;
}
}

H3 {
    font-size: 24px;
    padding-bottom: 5px;
    background-image: url(../images/listen.png);
    background-repeat: no-repeat;
    background-position: 0% top;
    padding-left: 25px;
    margin-right: 0px;
    margin-bottom: 20px;
    margin-top: 60px;
    margin-left: 0px;
    color: #00499C;
}
H3 BR.h3 {
    display: none;
}
@media (max-width: 400px) {
H3 BR.h3 {    display: block;    }
}
H5 {
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 15px;
    margin-top: 1px;
    border-bottom: 1px solid #B9B9B9;
    padding-bottom: 5px;
}



#main {
    margin-bottom: 60px;
}
@media (max-width: 991px) {
#sidebar {
    background-color: #F1F2EB;
    padding-top: 30px;
    padding-bottom: 30px;
}
}
#Snavi  UL {
    font-size: 15px;
    list-style-type: none;
    padding-left: 0px;
}
#Snavi  UL LI {
	background-color: #F1F2EB;
	border-bottom: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
	border-left: 1px solid #cccccc;
}
#Snavi  UL LI I a {
	vertical-align: middle;
}
#Snavi ul li a {
    display: block;
    text-decoration: none;
    background-color: #F1F2EB;
    color: #003779;
    padding-left: 6px;
    padding-top: 9px;
    padding-bottom: 9px;
	}
#Snavi ul li span.Sf13 {
	font-size: 13px;
	}

#Snavi  UL LI.Stitle  {
	background-color: #00489d;
	border-right: 1px solid #00489d;
	border-left: 1px solid #00489d;
	border-bottom: 1px solid #00489d;
	color: #ffffff;
}
#Snavi  UL LI.Stitle A {
	background-color: #00489d;
	color: #ffffff;
}
#Snavi  UL LI.first  {
	border-top: 2px solid #00489d;
	margin-top: 5px;
}
#Snavi  UL LI.last {
	border-bottom: 2px solid #00489d;
}
#Snavi  UL LI I {
	font-size: 12px;
	margin-right: 3px;
}


#Snavi a:hover
{
    display: block;
    color: #E50012;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
    background-color: #E8EADE;
}
#Snavi  UL LI.Stitle a:hover
{
	background-color: #00489d;
	display: block;
	color: #ffff00;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;    
}

/* ------------ サイドエリア  ----------- */

.side_banner {
	display: block;
	overflow: hidden;
	margin-top: 30px;
}

.side_banner DIV {
    margin-bottom: 20px;
    max-width: 227px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
}
.side_banner img {
    border: 1px solid #00499C;
}
/*
.side_banner a:hover img {
    opacity: 0.7;
}
*/
.side_banner DIV:after {
    content: "";
    position: absolute;
    z-index: 1;
    width: 150px;
    height: auto;
    background: #f0f00b;
    text-align: center;
    font-weight: bold;
    padding-top: 5px;
    padding-right: 35px;
    padding-left: 0px;
    padding-bottom: 3px;
    left: -30px;
    top: 3px;
    transform: rotate(-35deg);
    box-shadow: 0 1px 1px rgba(100, 100, 1000, 0.1);
}
.side_banner DIV:after {
    content: "知る";	/* 表示するテキスト */
    font-size: 12px;
    padding-top: 1px;
    padding-bottom: 1px;
    padding-left: 1px;
}
.side_banner DIV.side_banner_2:after {
    content: "購入";	/* 表示するテキスト */
}
.side_banner DIV.side_banner_3:after {
    content: "聞く";	/* 表示するテキスト */
}

@media (min-width: 600px) and (max-width: 991px) {
    .side_banner DIV.side_banner_1{
    float: left;
    margin-left: 30px;
}    
    .side_banner DIV.side_banner_2{
    float: right;
    margin-right: 30px;
}    
}



FOOTER {
    background-color: #00499C;
    color: #E8E8E8;
    font-size: 12px;
    position: relative;
}
FOOTER  IMG {
	position: absolute;
	bottom: 3px;
	right: 1px;
}
FOOTER  #f_tel {
    color: #C01B1E;
}
FOOTER  #f_tel span{
    display: block;
    text-align: center;
    font-size: 11px;
}
@media (max-width: 380px) {
FOOTER {
    text-align: left!important;
}
}


/*--- フッター定義 ---*/
#footer {
    padding-top: 30px;
    /*    
    padding-bottom: 30px;
*/    
    background-color: #F1F2EB;
    margin-top: 60px;
}

#footer UL  {
    list-style-type: none;
    padding-left: 1px;
}
#footer UL li {
    line-height: 1.2em;
    margin-bottom: 5px;
    margin-top: 5px;
}
#footer UL li I {
    padding-right:3px;
    color: #777;
    font-size: 10px;
    margin-left: 8px;
}

#footer UL A{
	font-size: 13px;
}
#footer UL li.midashi A {
    font-size: 14px;
}
#footer UL li.midashi I {
    margin-left: 0px;
}
@media  (max-width: 767px) {
#footer {
    background-color: #F1F1F1;
    border-top: 3px solid #FFFFFF;
}
.f_logo{
    border-top: 3px solid #FFFFFF;
    background-color: #F1F2EB;
    margin-top: 30px;
    padding-top: 30px;
    padding-bottom: 15px;
    }    
}
    
@media (min-width: 400px) and (max-width: 767px) {
#footer UL li {  margin-left: 30%;}
}

@media (max-width: 399px) {
#footerphone{font-size: 32px;	}
#footer UL li {   margin-left: 20%;}
}




#footer #f_tel {
    color: #00499C;
    border-radius: 4px;
    padding-top: 5px;
    padding-right: 5px;
    padding-bottom: 10px;
    padding-left: 5px;
    font-size: 24px!important;
    line-height: 1;
    font-weight: bold;
    margin-right: auto;
    margin-left: auto;
}
#footer UL#f_tel  a{
    font-size: 24px!important;
    margin-bottom: 18px!important;
    color: #E50012;
}
#footer UL#f_tel  a:hover,
#footer UL#f_tel  a:focus,
#footer UL#f_tel  a:active
{    color: #00499C;}
#footer UL#f_tel  a:visited
{    color: #E50012;}


#footer #f_tel SPAN {
    text-align: center;
    font-size: 12px;
    padding-top: 1px;
    padding-bottom: 1px;
    line-height: 0.2em;
    margin-bottom: 1px;
    background-color: #F1F1F1;
    padding-left: 5px;
    padding-right: 5px;
    z-index: 10;
    margin-right: auto;
    margin-left: auto;
}
#footer #f_tel LI {
    margin-bottom: 1px;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}
#footer #f_tel LI I {
    color: #2E2E2E;
    font-size: 18px;
    margin-left: 0px;
    margin-right: 1px;
    padding-left: 1px;
}
#footer #f_tel LI.adress {
    font-size: 11px;
    text-align: center;
    color: #4E4E4E;
    padding-top: 1px;
    margin-top: 1px;
}


#footer #f_tel .koiwa,
#footer #f_tel .mizue,
#footer #f_tel .kitasenju{
/*    
    padding-left: 70px;
    */
    text-align: center;
}
#footer #f_tel .koiwa+li,
#footer #f_tel .mizue+li,
#footer #f_tel .kitasenju+li{
    border-top: 4px solid #00499C;
    margin-top: -13px;
    padding-top: 8px;
    z-index: 1;
    /*
    margin-left: auto;
    margin-right: auto;
    */
    /*
    width: 8em;
    */
}
#footer  .midashi {
    font-weight: bold;
}

#footertel #f_time {
	margin-bottom: 3px;
}
#footertel #f_come {
	font-size: 11px;
	margin-top: 5px;
}


#footertitle{
	color: #00947E;
	font-size: 24px;
	font-weight: bold;
	line-height: 1;
	margin-bottom: 5px;
}
#footerphone{
	color: #00947E;
	font-size: 36px;
	font-weight: bold;
	line-height: 1;
	margin-bottom: 4px;
	padding-left: 8px;
	margin-top: 4px;
}



#footerphone I{
	margin-right: 10px;
}






/* ----------------  パンクズ -----------------*/

.bk_breadcrumb {
    border-top: 0px solid #EDF9F7;
    padding-top: 25px;
}
.breadcrumb {
    background: transparent;
    padding-top: 10px;
    padding-bottom: 4px;
    margin-bottom: 1px;
    font-size: 12px;
    padding-left: 1px;
}
/*
.breadcrumb li+li:before {
  content:'»';
}
*/
.breadcrumb OL {
    padding-bottom: 3px;
}

/* ----------------  ヘッダー加工 -----------------*/
#title_logo {
    display: inline-block;
}

header { background-color: #00499C;}
/* メニュー下部設定 */
#wrap {
    position: relative;
}
#content-main{    margin-top: 147px;}
@media (min-width: 661px) and (max-width:991px) {
#content-main{    margin-top: 220px;}
}
@media (min-width: 2px) and (max-width:660px) {
#content-main{    margin-top: 260px;}
}

.navbar {
    top: 0px;
    position: absolute;
    width: 100%;
    border-width: 0px;
    margin-top: -1px;
}

#top_tel {
    float: right;
    font-size: 24px;
    color: #FFFFFF;
    line-height: 0.4;
    text-align: right;
    font-weight: bold;
    margin-top: 5px;
}
#top_tel span {
	font-size: 13px;
	margin-right: 3px;
}
#top_tel UL LI  {
    margin-bottom: 12px;
    list-style-type: none;
}


#logo_title {
    display: block;
    margin-top: -10px;
    margin-bottom: 15px;
}
#logo_title_sp {    display: none;}
#title_logo a:hover img {
 filter: saturate(100%);
    opacity: 1;
}

[href^="tel"] {
    text-decoration: none;
    cursor: default;
    pointer-events: none;
}
@media screen and (max-width: 768px) {
    [href^="tel"] {
    pointer-events: auto;
    text-decoration: underline;
    color: #F5F5F5;
    }
     #footer   [href^="tel"] {
    pointer-events: auto;
    text-decoration: underline;
    color: #00499C;
    }
    
#footer UL#f_tel  a{
    color: #00499C;
}    
    
}

@media (max-width: 991px) {
#title_logo {
    display: block;
}    
#top_tel {
	float: none;
	text-align: center;
	display: block;
}
#logo_title {    display:none;
    margin-top: 0px;
    }
#logo_title_sp {
    display: block;
}

}
@media (max-width: 345px) {
#top_tel {
	}
#top_tel span {
	font-size: 12px;
	margin-right: 0px;
}}
	

/* ----------------  フッター歯-----------------*/

/* 画像提供*/
.image_support {
	font-size: 10px !important;
	color: #777777;
	line-height: 1.4em;
	margin-left: 5px;
	margin-top: 0px;
	clear: both;
}


#Topreturn {
	text-align: right;
	display: block;
}
#TopreturnMain {
	display: block;
	margin-right: auto;
	margin-left: auto;
}

#Topreturn #rtn_top {
    z-index: 500;
    position: fixed;
    bottom: 20px;
    right: 20px;
}
#Topreturn #rtn_top a {
	border-radius: 48px;
	font-size: 18px;
	padding-left: 5px;
	text-decoration: none;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-right: 5px;
    
	display: block;
	font-weight: bold;
	z-index: 500;
}
#Topreturn #rtn_top a:hover {
	text-decoration: none;
	background-repeat: no-repeat;
	background-position: right center;
	color: #FFFFFF;
}


.test.hover {
  -webkit-tap-highlight-color: transparent;
  color: red;
}

#Topreturn #rtn_top a:visited,#Topreturn #rtn_top a:link,#Topreturn #rtn_top a:active
{color: #00499C!important;
    background-color: #F0F00B;
}

#Topreturn #rtn_top a.hover {
    color: #F0F00B!important;
	background-color: #00499C;
}
@media (min-width: 992px) {
 #Topreturn #rtn_top a:hover
{
    color: #F0F00B!important;
	background-color: #00499C;
}   
}



/* ----------------  設定値 -----------------*/

.color_wh { color: #FFFFFF; }
.color_br { color: #00499C; }
.color_yl { color: #f0f00b; }
.color_re { color: #E50012; }

.color_r_f { color: #c55765!important; }
.color_b_f { color: #004590!important; }

.colorB1 {
    color: #00499C;
    font-size: 20px;
    margin-top: 10px;
    font-weight: bold;
    margin-bottom: 10px;
}
.colorBK1 {
    color: #111111;
    font-size: 18px;
    font-weight: bold;
}
.colorBK2 {
    color: #111111;
    font-size: 16px;
    margin-top: 20px;
    font-weight: bold;
    margin-bottom: 5px;
}

.bg_color_wh {
	background-color: #FFFFFF;
	line-height: 1;
}
.bg_color_gr {
	background-color: #F1F2EB;
}
.bg_color_gr2 {
    background-color: #F1F2EB;
    padding-top: 15px;
    padding-right: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
}
.bg_color_gr3 {
    background-color: #F1F2EB;
    padding-top: 5px;
    padding-right: 2px;
    padding-bottom: 5px;
    padding-left: 32px;
    margin-top: 5px;
    color: #060606;
}
.bg_color_gr3 SPAN{
    margin-right: 5px;
    background-color: #00499C;
    color: #FFFFFF;
    font-size: 15px;
    border-radius: 14px;
    padding-top: 2px;
    padding-right: 2px;
    padding-bottom: 2px;
    padding-left: 2px;
    margin-left: -26px;
}

.bg_bg1 {
    background-image: url(../images/bk1.jpg);
    background-repeat: repeat;
}

.t_center {
    text-align: center!important;
}
.f_bold {
    font-weight: bold!important;
}

.f12 {	font-size: 12px; }
.f13 { 	font-size: 13px; }
.f20 { 	font-size: 20px; }
.f20_8 {
	font-size: 20px;
	line-height: 1.8em;
}



/*  UL */

.ul_abc {
	list-style-type: lower-alpha;
	list-style-position: outside;
	margin-left: 0px;
	margin-top: 10px;
}


.hr1 {
	border-left: 0;
	border-right: 0;
	border-top: 1px solid #E4E0D5;
	border-bottom: 1px solid #fff;
	margin-top: 30px;
	margin-bottom: 30px;
}

.btn1, .btn1:focus {
    background-color: #00499C;
    text-decoration: none !important;
    display: block;
    text-align: center;
    margin-bottom: 15px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 2px;
    padding-bottom: 2px;
    color: #FFFFFF;
    border-radius: 4px;
}
.btn1:hover {
    color: #f0f00b;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
    background-color: #7887A7;
}


/* ボーダー設定 */
.bt_0 {
	border-top: 0px solid #E98789!important;
}


/* ----------------  画面サイズによる切り替え -----------------*/

/*    改行操作   */
.br480 { display: none;}
@media (max-width: 480px){
.br480 { display: block;}
}
.br767 { display: block;}
@media (max-width: 767px){
.br767 { display: none;}
}


/*   画像置き換え   */
.img480_pc { display: block;}
.img480_sp { display: none;}
@media (max-width: 480px){
.img480_pc { display: none;}
.img480_sp { display: block;}
}

/*  テキスト操作　 */
/*  col-sm でテキスト中央より　 */
.text-sm-left-center{
	text-align: center;
}
@media (min-width: 768px){
.text-sm-left-center{
	text-align: left;
}
}
@media (min-width: 768px){
.spBr {
	display: none;
}
}


/*  フロート切り替え */
.float-sm-left-center{
	float: left;
	margin-right: 20px;
	margin-bottom: 10px;
}
.float-sm-right-center{
	float: right;
	margin-left: 20px;
	margin-bottom: 10px;
}
@media (max-width: 767px){
.float-sm-left-center,
.float-sm-right-center{
	float: none;
	margin-left: auto;
	margin-right: auto;
}
}



/* ----------------  マージン設定 -----------------*/
.m_0 {
	margin-top: 0px !important;
	margin-right: 0px !important ;
	margin-bottom: 0px !important;
	margin-left: 0px !important;
}

.m_t0 {
	margin-top: 0px !important;
}
.m_t10 {
	margin-top: 10px !important;
}
.m_t1e {
	margin-top: 1em !important;
}
.m_t30 {
	margin-top: 30px !important;
}
.m_t45 {
	margin-top: 45px !important;
}
.m_t60 {
	margin-top: 60px !important;
}
.m_t90 {
	margin-top: 90px !important;
}
.m_nt10 {
	margin-top: -10px !important;
}
.m_nt30 {
	margin-top: -30px !important;
}

.m_b0 {
	margin-bottom: 0px !important;
}
.m_b1e {
	margin-bottom: 1em !important;
}
.m_b30 {
	margin-bottom: 30px !important;
}
.m_b60 {
	margin-bottom: 60px !important;
}
.m_b90 {
	margin-bottom: 90px !important;
}
.m_b120 {
	margin-bottom: 120px !important;
}

.m_l0 {
	margin-left: 0px !important;
}
.m_l15 {
	margin-left: 15px !important;
}
.m_l30 {
	margin-left: 30px !important;
}
.m_l90 {
	margin-left: 90px !important;
}
.m_nl30 {
	margin-left: -30px !important;
}

.m_r0 {
	margin-right: 0px !important;
}

.m_lr10 {
	margin-left: 10px !important;
	margin-right: 10px !important;
}


.p_lr0 {
	padding-left: 0px !important;
	padding-right: 0px  !important;
}
.p_b30 {
	padding-bottom: 30px !important;
}

/* ----------------  バナー切り替え -----------------*/

.side_banner {}

.b242f,.b242q {	display: none;}
.b360f {
	display: block;
	float: right;
	margin-top: 10px;
}
.b360q {
	display: block;
	float: left;
	margin-top: 10px;
}
@media (min-width: 992px) {
.b242f,.b242q {
	display: block;
	margin-top: 10px;
}
.b360f,.b360q {	display: none;}
}


.side_banner a:hover img {
opacity:0.7;
}


.banner_contact a img {
  -webkit-filter: grayscale(0);
  filter: grayscale(0);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}
.banner_contact a:hover img {
opacity:0.8;
  -webkit-filter: saturate(130%);
 filter: saturate(130%);
}

.banner_contact{
    background-color: #D7DFE9;
}


.banner_contact1 {
    font-family: "游明朝","Hiragino Mincho ProN","游ゴシック",  "メイリオ", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",  Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    border: 2px solid #00499C;
    font-size: 22px;
    background-image: url(../images/banner_contact1.jpg);
    background-position: right center;
    background-repeat: no-repeat;
    color: #00499C;
    display: block;
    background-size: contain;
    -webkit-box-shadow: 1px 1px 1px #f1f1f1;
    box-shadow: 1px 1px 1px #f1f1f1;
}
.banner_contact1 DIV {
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 20px;
}
.banner_contact1 SPAN{
    font-size: 15px;
    background-color: #F0F00B;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 1px;
    padding-bottom: 1px;
    display: inline-block;
    color: #3B3B3B;
    -webkit-box-shadow: 1px 1px 1px 0 #C9C9C9;
    box-shadow: 1px 1px 1px 0 #C9C9C9;
}
.banner_contact1 :hover{
    background-color: rgba(221,233,241,0.30);
    color: #00499C;
}
.banner_contact1 SPAN:hover{
    background-color: rgba(221,233,241,0.30);
    color: #00499C;
}
@media (max-width: 480px) {
.banner_contact1 DIV {
    font-size: 17px;
    padding-left: 10px;
    }
.banner_contact1 SPAN{
    font-size: 13px;
    padding-left: 4px;
    padding-right: 4px;
    margin-top: 10px;
    }
}
/*------------------ 共通部品　------------------*/


/*   リンクボタン   */
.link_btn_bk {
    background-color: #F1F2EB;
    padding-top: 10px;
    padding-right: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
}
.link_btn {
    font-size: 14px;
    background-color: #F1F2EB;
    padding-top: 10px;
    padding-right: 8px;
    padding-bottom: 25px;
    padding-left: 8px;
    margin-top: 0px;
    margin-bottom: 15px;
}
.link_btn a {
    font-size: 24px;
    color: #00499C;
}
.link_btn H4{
}
.link_btn H4 a{
    line-height: 1em;
    padding-top: 13px;
    padding-bottom: 13px;
    background-color: #00499C;
    color: #FFFFFF;
    display: block;
    font-size: 14px;
    padding-left: 2px;
    padding-right: 2px;
    border-radius: 4px;
    text-align: center;
}
.link_btn H4 a:hover{
    color: #f0f00b;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
    background-color: #7887A7;
}
.link_btn H4 i{
    padding-right: 3px;
    font-size: 100%;
    font-weight: normal;
}