@charset "utf-8";
/* CSS Document */
body {
	/*スマホで勝手に文字が大きくなる対策*/
	-webkit-text-size-adjust: 100%;
}
.sp-view {
    display: none;
}
a:hover {
    opacity: 1!important;
    text-decoration: none;
}
#contents_outer {
    padding: 140px 0 0;
}

#article__wrap * {
    font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif;
}
#info-wrraper * {
	font-family: "メイリオ",Meiryo,Tahoma,Verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}

#article__wrap * .fa {
    font-family: FontAwesome;
}

#article__wrap i.fa {
    margin-right: 5px;
	position: relative;
}

#article__wrap #service-ul {
    margin-right: 0!important;
    padding-top: 3px;
}

#service-wrraper {
	height: 30px;
}
#service {
	z-index:101;
	width: 100%;
	min-width: 1150px;
	height: 30px;
	background: #00468c;
	position: block;
	top: 0;
	left: 0;
}
#my-page-area {
	float: left;
}
#my-page-area dl {
	padding: 0 0 0 10px!important;
	float:left;
	height: 100%;
}
#my-page-area dl dt {
	background: url(/images/bg_mypage_arrow.png) no-repeat right 8px!important;
	padding: 4px 10px 0 0!important;
	float: left;
	color: #fff;
	margin: 0 3px 0 0;
}
#my-page-area dl .new_member,
#my-page-area dl .my_page {
	float: left;
	margin: 0 2px 0 0;
}
#my-page-area dl #login,
#my-page-area dl #logout {
	float: left;
	margin: 0 2px 0 0;
	cursor: pointer;
}
#my-page-area dl #loginPopUp {
	display: none;
}
#service-right {
	float: right;
}
#service-right ul {
	float: left;
}
#service-right ul li {
	float:left;
	margin-left: 2px;
	position: relative;
	color: #fff;
	margin-right: 14px;
}
#service-right p {
	float: left;
	padding: 8px 0px 0 0;
	color: #fff;
	font-weight: bold;
	font-size: 12px;
}
#head_count {
	float: right;
	cursor: pointer;
	margin-right: 8px;
}
#head_count .history,
#head_count .favorite {
	text-align: right;
	width: 72px;
	height: 63px;
	float: left;
}
#head_count .history .count,
#head_count .favorite .count {
	padding: 10px 5px 0 0;
}
#head_count .history .count_txt,
#head_count .favorite .count_txt {
	text-align: center;
	font-size:80%;
}
#hisCnt,
#favoCnt {
	color:#fff;
	font-size:18px;
	text-align:center;
}
#info-wrraper {
	width: 100%;
	margin: 0 auto;
	position: absolute;
    top: 30px;
    background: #fff;
}
.info-wrraper01 {
	width: 1150px;
	margin: 0 auto;
}
#logo {
	float: left;
	margin: 14px 0 12px;
}
#info {
	float: right;
	margin-top: 23px;
}
#info .tel {
	float: right;
	font-size: 28px;
	position: relative;
	padding-left: 41px;
	line-height: 1em;
	margin-bottom: 3px;
}

#info .tel:before {
    content: "";
    background: url(/images/icn_tel.png) no-repeat;
    width: 35px;
    height: 24px;
    position: absolute;
    top: 0px;
    left: 0;
}

#info .time {
	clear: both;
	text-align: right;
	font-size: 13px;
	line-height: 1em;
}
#nav {
	clear: both;
	border-top: 1px solid #0483c8;
	border-bottom: 1px solid #0483c8;
    position: absolute;
    top: 120px;
    z-index: 1000;
    width: 100%;
    background: #fff;
}


#nav .nav_list {
	width: 1151px;
	margin: 0 auto;
}
#nav .nav_list li {
	float:left;
}

/*---------------------------------------------------------
	ドロップダウン
 ---------------------------------------------------------*/
.nav_list .dropList {
	position: relative;
	cursor: pointer;
}
.nav_list .dropList .dropmenu-list {
	display: none;
	width: 230px;
	position: absolute;
	top: 49px;
	background: rgba(0, 117, 194,0.5);
	z-index: 110;
	text-align: center;
}

.nav_list .dropList .dropmenu-list li {
	margin: 0;
	padding: 0;
	border-top: 1px dotted #fff;
	font-size: 14px;
	font-weight: bold;
}
.nav_list .dropList .dropmenu-list li:hover .dropmenu-list li{
    visibility: visible;
    height: 38px;
    border-bottom: 1px solid #fff;
}
.nav_list .dropList .dropmenu-list li:first-child {
  border-top: none;
}
.nav_list .dropList .dropmenu-list li .dropttl,
.nav_list .dropList .dropmenu-list li .lastList {
  border-bottom: none;
}
.nav_list .dropList .dropmenu-list li .dropttl {
  padding: 3px;
  font-size: 13px;
  font-weight: bold;
  color: #fff;
  background: rgba(70, 162, 19, 0.7);
  text-align: center;
}
.nav_list .dropList .dropmenu-list li.bottom {
  border-bottom: none;
}
.nav_list .dropList .dropmenu-list li a {
  display: inline-block;
  padding: 13px 5px;
  width: 220px;
  text-align:center;
  color: #fff;
  line-height: 22px;
}
.nav_list .dropList .dropmenu-list li a:hover {
  color: #fff;
  background: rgb(0, 117, 194);
  text-decoration:none;
}


/*-追加-*/
#my-page-area dt {
	color:#000!important;
}
#service-right a {
	color: #fff;
}
#service-right .headCnt {
	position: absolute;
	top: 4px;
	right: 4px;
}


.header_font {
	margin: auto;
	color: #000;
	float: left;
	font-size: 30px;
	padding:26px 0 0 70px;
	font-weight: bold;
}

/*contents*/
#contents {
    width: 950px;
    margin: auto;
    min-height: 300px;
}

#article {
    width: 700px;
    float: right;
}

#aside {
    float: left;
    width: 234px;
}

#path {
    margin:0px auto 5px;
    width: 950px ;
    padding-top: 10px;
}

#path a{
    margin-right:5px;
    margin-left:5px;
}

#path strong{
    margin-right:5px;
    margin-left:5px;
}

/*h1_section*/
.h1_section {
    background: url(/images/ttl_h1.jpg) no-repeat left center;
    margin: 0 0 10px;
    width: 950px;
    min-height: 40px;
}
.h1_section h1 {
    float: left;
    font-size: 18px;
    padding: 0 0 0 7px;
    margin: 6px 0 0 10px;
    font-weight: bold;
    display: inline;
    border-left: 4px solid #130975;
    width: 920px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.h1_section h2.h2_bkn {
    float: left;
    width: 880px;
    color: #fff;
    margin: 0;
    padding: 10px 0;
    border: none;
    min-height: 25px;
    font-size: 18px;
    font-weight: bold;
    display: inline;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.h1_section h2.h2_all {
    float: left;
    width: 920px;
    font-size: 18px;
    padding: 0 0 0 7px;
    margin: 6px 0 0 10px;
    font-weight: bold;
    display: inline;
    border-left: 4px solid #130975;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

/*h1-section-s*/
.h1-shot {
    background: url(/images/bg_h1_shot.jpg) no-repeat left center;
    width: 700px;
}
.h1-shot h1 {
    width: 435px;
}
.h1-shot .sns {
    float: right;
    width: 234px;
}

#article__wrap li.history {
    background: url(/images/bg_head_history.jpg) no-repeat left bottom;
}
#article__wrap li.history:hover {
    background: url(/images/bg_head_history_on.jpg) no-repeat left bottom;
}
#article__wrap li.favorite {
    background: url(/images/bg_header_favorite.jpg) no-repeat left bottom;
}
#article__wrap li.favorite:hover {
    background: url(/images/bg_header_favorite_on.jpg) no-repeat left bottom;
}



.btn {
  position: relative;
  width: 230px;
  height: 48px;
  margin: 0 auto;
  display: block;
  overflow: hidden;
  cursor: pointer;
}
.btn img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  display: block;
}
.btn:hover img:nth-of-type(2) {
  opacity: 0;
}




@media screen and (max-width: 768px) {
    #esbody,
    .container {
        min-width: 100vw;
    }
    #service {
        width: 100%;
        min-width: 100%;
    }
    .l-header {
        display: none;
    }
    .sp-view img {
        vertical-align: bottom;
        width: 100%;
        height: 100%;
    }
    .sp-view a:hover {
        text-decoration: none;
        color: #898989;
    }
    .info-wrraper01 {
        width: 11.333vw;
        margin: 0 auto;
    }
    #nav,
    #info-wrraper {
        display: none;
    }
    .sp-view {
        display: block;
    }
    #logo {
        display: flex;
        align-items: center;
    }
    .sp-header {
        display: flex;
        justify-content: space-between;
        padding: 0 1.667vw 0 3.533vw;
        margin-bottom: 3vw;
        align-items: baseline;
        position: relative;
    }
    .header__contact {
        display: flex;
    }
    .header-logo {
        display: flex;
        gap: 0 2.333vw;
    }
    .header_font {
        font-size: 3.3vw;
        padding: 0;
        float: none;
        margin: 4vw 0;
    }
    .header-logo p a{
        width: 22vw;
        display: block;
        margin-top: 2vw;
    }
	#article__wrap ul.header__contact {
		display: flex;
		margin-right: 0;
		gap: 0 2vw;
		border: 1px solid #898989;
		border-radius: 0 0 5px 5px;
		position: absolute;
		right: 1.6vw;
		top: -0.2vw;
	}
	.header__contact__item {
		position: relative;
	}
    .header__contact__item a {
        font-size: 3vw;
        color: #898989;
        padding: 6.8vw 1vw 1.5vw 1vw;
        height: 11.73vw;
        display: block;
        box-sizing: border-box;
        width: 11vw;
        text-align: center;
    }

	.header__contact__item span {
		position: absolute;
		display: block;
		text-align: center;
		margin: 0 auto;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
	}
    .header__contact__item.--mail span{
        width: 4.433vw;
        top: 2.2vw;
    }
    .header__contact__item.--tel span{
        width: 4.9vw;
        top: 1vw;
    }
    .header__contact__item.--mail::after {
        position: absolute; /*--positionを追加--*/
        top: 0;
        right: -1.1vw;
        content: "";
        width: 1px; /*--縦線の太さ(幅)--*/
        height: 95%;
        background-color: #898989; /*--縦線の色--*/
    }
}