@charset "utf-8";
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ヘッダー(インフォメーション)
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

#header_frame .logo {
    width: 157px;
    padding: 7px 0;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ヘッダー右
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

div#header_right_section td.tel{
    font-size: 24px;
    font-family: 'Oswald', sans-serif;
    padding-right: 10px;
}

div#header_right_section td.tel:before{
    content: "\E821";
    font-size: 28px;
    font-family: "fontello";
    margin-right: 5px;
    vertical-align: -2px;
    color: #9f8167;
}

div#header_right_section td.open{
    position:relative;
    padding-right:30px;
}

div#header_right_section td.open:after{
    content:"";
    width:1px;
    height:50px;
    background:#000;
    position:absolute;
    right:0;
    display:inline-block;
    top:0;
}

div#header_right_section .sns_link_btns{
    align-items:center;
    margin:0 10px;
}

div#header_right_section .sns_link_btns a{
    font-size:24px;
}

div#header_right_section .sns_link_btns a:hover{
    color:#9f8167;
}

div#header_right_section .btn_area{
    display:flex;
}

div#header_right_section .btn{
    margin:0 5px;
}

div#header_right_section .btn a{
    height:54px;
    display:flex;
    align-items:center;
    font-size:15px;
    padding:0 20px;
    border: 2px solid;
    color: #9f8167;
    border-radius: 8px;
}

div#header_right_section .calender a:before{
    content: "";
    display: inline-block;
    background: url(https://sousyakan.jp/wordpress3/wp-content/themes/cyber-child/images/calender_p2.svg) no-repeat 50% / contain;
    width: 27px;
    height: 23px;
    margin-right: 10px;
}

div#header_right_section .btn_area a:hover{
    background:#9f8167;
    color:#fff;
    border-color:#9f8167;
}

div#header_right_section .calender a:hover:before{
    background: url(https://sousyakan.jp/wordpress3/wp-content/themes/cyber-child/images/calender_w.svg) no-repeat 50% / contain;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
グローバルナビ（下段）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

div#h_navi_main {
    background: #fff;
}

/* 親メニューのみ */
#h_navi_main ul > li {
    position:relative;
    min-width: 50px;
	padding: 0 10px;
}

#h_navi_main ul > li:first-child {
    min-width: 40px;
}

#h_navi_main ul > li > a {
    color:  #000;
    padding: 10px 0px 18px;
    font-size: 14px;
	position:relative;
}

/* 親メニューのみ(アクティブ状態)（display:table-cellを使用するためAではなくLIに変化をつける） */
#h_navi_main ul > li[class*='current'], #h_navi_main ul > li:hover {
    background: #ffffff;
}

body[class*="dress"] #h_navi_main ul > li > a[href*="dress"], 
#h_navi_main ul > li[class*='current'] > a, 
#h_navi_main ul > li:hover > a {
    color: #9f8167;
}

#h_navi_main ul > li > a:after {
    content: '';
    display: block;
    width: 50px;
    height: 0;
    background-color: #9f8167;
    position: absolute;
    bottom: 0px;
    left: calc(50% - 25px);
    opacity: 0;
    transition: all 400ms linear;
}

body[class*="dress"] #h_navi_main ul > li > a[href*="dress"]:after, 
#h_navi_main ul > li[class*='current'] > a:after,
#h_navi_main ul > li > a:hover:after {
    opacity: 1;
    height: 1px;
    bottom: 12px;
}

/* アイコン */
#h_navi_main ul > li.contact a:before{
    content: "\F0E0";
    font-size: 23px;
    font-family: "fontello";
    margin-right: 14px;
    vertical-align: -2px;
    color: #e85d6b;
}

#h_navi_main ul > li.home> a{
    font-size: 17px;
}

/*フッターナビに内部リンクを追加したことで、TOPページ時にヘッダーナビ「ウェブカタログ」のカレントがついてしまうためcssを修正 2026-06-03re*/
body.home #h_navi_main ul > li.current_page_parent:not(.home) > a{
    color:#000;
}

body.home #h_navi_main ul > li.current_page_parent:not(.home) > a:after{
    opacity: 0;
    height: 0;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
グローバルナビ（ドロップダウン）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#h_navi_main {
    position: relative;
}
#h_navi_main ul li {
    position: static;
}

#h_navi_main ul.sub-menu {
    display: none;
}

#h_navi_main ul li:nth-child(2) ul.sub-menu {
    width: 100%;
    left: 0;
    padding: 35px calc( (100% - 1100px) / 2 );
    background: #a38c78;
    z-index: 1;
	/* 上に余白ができているため（2023-07-18 kami） */
	/* top:60px; */
	top:52px;
}

#h_navi_main ul li:nth-child(2) ul.sub-menu ul.sub-menu {
    display:none!important;
}

#h_navi_main ul li:nth-child(2) > a:hover:after {
    display: none;
}

#h_navi_main ul.sub-menu li {
    float: left;
	/* タイトルを長くしたため5列に変更（2023-07-18 kami） */
    /*width: calc(100% / 6);*/
	width: calc(100% / 5);
}

#h_navi_main ul.sub-menu li a {
    padding: 10px 20px;
    color: #fff;
    font-size: 15px;
    display: inline-block;
}

#h_navi_main ul.sub-menu li a:before {
    font-family: "fontello";
    content: '\e80b';
    margin-right: 5px;
}

#h_navi_main ul.sub-menu li a:after {
    width: 0;
    height: 1px;
    background: #fff;
    left: 20px;
    bottom: 8px;
    opacity: 1;
    transition: width .2s;
    display: inline-block;
}

#h_navi_main ul.sub-menu li a:hover:after {
    width: calc(100% - 40px);
    display: inline-block;
}

#h_navi_main ul > li[class*='current'], #h_navi_main ul > li:hover {
    opacity: 1!important;
    background: none;
}

#h_navi_main ul.sub-menu > li[class*='current'] a, #h_navi_main ul.sub-menu > li:hover a {
    color: #fff;
}

#h_navi_main ul.sub-menu > li[class*='current'] a:after, #h_navi_main ul.sub-menu > li:hover a:after {
    width: calc(100% - 40px);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ローカルナビ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.child_navi_wrap {
    background: #ca9f86;
    padding-top: 10px;
    margin: 0px 0;
}

ul.child_navi{
    border-bottom:0;
    padding: 0;
    text-align:  left;
    justify-content: left;
	flex-wrap: wrap;
}

ul.child_navi li {
    padding-left: 0;
    margin: 0 5px 0px;
    padding-bottom: 0;
}

ul.child_navi li:not(:first-child) {
    margin-left: 0;
}

ul.child_navi li:before {
    content: none;
}

ul.child_navi li a {
    color:  #fff;
    font-family:  "my_mincho",serif;
    padding: 20px 20px 30px 37px;
    display:  inline-block;
    font-size: 18px;
    background: no-repeat;
    position: relative;
}

ul.child_navi li a:hover,
ul.child_navi li[class*='current'] a {
    background:  #fff;
    color: #ca9f86;
    text-decoration:none;
}

ul.child_navi li a:hover:before,
ul.child_navi li[class*='current'] a:before{
    content:"\E81C";
    font-family:"fontello";
    position:  absolute;
    left: 10px;
    top: 50%;
    margin-top: -15px;
    font-size: 18px;
	line-height:1;
}

ul.child_navi > li > a:after {
    display: none;
}

/* Q&Aのみスタイル */
body[class*="qa"] .child_navi_wrap {
    background: #e3d0c5;
    padding-top: 10px;
    padding-bottom:10px;
}

body[class*="qa"] ul.child_navi li {
    margin: 0;
    width:20%;
    justify-content:space-between;
}

body[class*="qa"] ul.child_navi li a {
    width:100%;
    padding: 6px 10px 6px 30px;
    font-size: 16px;
    text-align:left;
    color:inherit;
}

body[class*="qa"] ul.child_navi li a:hover,
body[class*="qa"] ul.child_navi li[class*='current'] a {
    background: transparent;
    text-decoration:underline;
}

body[class*="qa"] ul.child_navi li a:before{
    content:"\E81C";
    font-family:"fontello";
    position:  absolute;
    left: 10px;
    top: 50%;
    margin-top: -9px;
    font-size: 16px;
    line-height:1;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
フッター(ナビ)
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
div#f_navi_wrap {
    background: #ffffff;
}

div#f_navi_wrap .wrap_inner {
	position:relative;
}

div#f_navi_wrap ul:not(.sub-menu) > li {
    margin-right: 25px;
}

div#f_navi_wrap ul li.satsuei {
    margin-right: 0;
}

div#f_navi_wrap .satsuei ul.sub-menu {
    display: flex;
    flex-wrap: wrap;
    margin: 15px 0;
    background: #F4F0E8;
    list-style: none;
    padding: 20px 20px 12px;
}

div#f_navi_wrap .satsuei ul.sub-menu li {
    margin: 0 20px 10px 0;
}

div#f_navi_wrap .satsuei ul.sub-menu li:before {
    content: '';
    width: 5px;
    height: 5px;
    background: #9f8167;
    display: inline-block;
    border-radius: 50%;
    vertical-align: 2px;
    margin-right: 5px;
}

div#f_navi_wrap p.bnr{
	right:0;
	bottom:0;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
PCのみ中央揃えにする
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.align_c_pc {
    text-align: center;
}