﻿#header {
    width: 100%;
}
#header .header_box {
    width: 100%;
    height: 54px;
    display: flex;
    max-width: 960px;
    margin: 0 auto;
    background-size: cover;
    background-repeat: no-repeat;
    background-color: #F88AC3;
    box-shadow: rgba( 0, 0, 0, .1) 0 2px 0;
    z-index: 999;
}
#header .header_box .inner {
    flex: 1;
    height: auto;
    font-size: 1.8rem;
    text-align: left;
}
#header .header_box .inner a {
    position: relative;
    display: block;
    padding: 0;
    color: #000;
    border-left: none;
    background-repeat: no-repeat;
/*  background-image: url('/../img/index/2019/image_header_nabbit.png');
    background-size: auto 70px;
    background-position: -6px center;*/
    background-image: url('/../img/index/2019/image_header_20th.png?20260115');
    background-size: auto 50px;
    background-position: 8px top;
}
#header .header_box .inner svg.logo {
    position: absolute;
    top: 2px;
	bottom: 0;
    left: 36px;
    height: calc( 40px * 0.9 );
    width: calc( 150px * 0.9 );
    margin: auto;
    fill: #fff;
}
#header .header_box .inner .prefecture {
    position: absolute;
    top: 6px;
    left: 50px;
    display: block;
    width: 40px;
    height: 12px;
    line-height: 12px;
    border-radius: 4px;
    background-color: #FEEBF5;
    color: #F772B7;
    font-size: .9rem;
    text-align: center;
    font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
}

/*　iPhone5, SE　*/
@media screen and (max-width: 320px) {
	#header .header_box .inner a {
		background-size: auto 60px;
	}
	#header .header_box .inner svg.logo {
		left: 27px;
		height: calc( 40px * 0.80 );
		width: calc( 150px * 0.80 );
	}
}

#header .header_box div {
    width: 54px;
    height: auto;
    font-size: .9rem;
    font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
    text-align: center;
}
#header .header_box div a {
    position: relative;
    display: block;
    height: 54px;
    border-left: solid 1px #FAA2CF;
    color: #000;
}
#header .header_box  .menu svg {
    position: absolute;
    top: 8px;
    right: 0;
    left: 0;
    margin: auto;
    fill: white;
    height: 24px;
    width: 24px;
    display: block;
}
#header .header_box a .icontext {
    position: absolute;
    bottom: 6px;
    right: 0;
    left: 0;
    margin: auto;
    display: block;
    font-family: 'Hiragino Sans', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ" , Meiryo , "Meiryo UI", "Noto Sans", Roboto, Helvetica, sans-serif;
    text-align: center;
}
#header .header_box .mypage,
#header .header_box .favorite {
    position: relative;
}
#header .header_box .mypage .count,
#header .header_box .favorite .bm_count,
#header .header_box .favorite .count {
    display: block;
    position: absolute;
    top: 4px;
    right: 4px;
    font-weight: bold;
    text-align: center;
    min-width: 12px;
    min-height: 12px;
    line-height:12px;
    padding: 2px;
    border-radius: 16px;
    box-shadow: 0px 1px 1px rgba(0,0,0,0.1);
    background-color: #fff;
    color: #F772B7;
    font-size: 0.9rem;
}
#header .header_box .favorite .bm_count,
#header .header_box .favorite .count
{
    background-color: #fff;
}

/*--------------------------------------

    タブレット・PC向け表示

---------------------------------------*/
@media screen and (min-width:600px) {
    #header .header_box .inner a {
        background-position: -1% center;
    }
    #header .header_box div {
        width: 90px;
    }
}
