@charset "UTF-8";
/* 
Theme Name: SUEHIRO_TEMPLATE_6.0.6
Description:  SUEHIRO_TEMPLATE_6.0.6
*/



/* ---------------------------------------------------------------------------------
* BASE RAYOUT
------------------------------------------------------------------------------------ */
html{
height:100%;
}
body{
margin: 0;
font-size: 14px;
line-height: 1.6;
/*font-family:"Sawarabi Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", "メイリオ", Meiryo, serif;
*/
font-family:'Noto Serif JP', serif, "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", "メイリオ", Meiryo, serif;
overflow-wrap: break-word;
word-break: normal;
}
#header{
width: 100%;
z-index: 10000;
margin:0;
background: #fff;
border-bottom: solid 1px #efefef;
}
#header-sp{
display: none;
}




#content{
padding-top:30px;
clear:both !important;
padding-bottom:60px;
}
#main{
width: 100%;   
float: left;
}
.main-inner{
margin-right: 330px;
background: #fff;
}
article{
}
#side {
width: 300px;
float: left;
margin-left: -300px;
}
.side-inner{
/*ダミー
background:#FFE8E8;
*/
}
.side-widget-area{
/*ダミー
background:#FFDDE9;
*/
}
#footer{
border:solid 1px #efefef;
padding:0 0 30px 0;
background:#e6e4e2;
clear:both;
}

/* ---------------------------------------------------------------------------------
* BASE COLOR
------------------------------------------------------------------------------------ */
p{
color: #2B2D2D;
line-height:200%;
font-size:14px;
margin:0 0 2em;
}
a {
color: #660025;
line-height:150%;
}

a:hover{
color:#660025;
}



a img:hover {
opacity: 1.0  !important;

}

#content a:hover{
color:#5BCDFD;
}

/* embed
-------------------------------------------------- */
img {
max-width: 100%;
height: auto;
vertical-align: middle;
border: 0;
-ms-interpolation-mode: bicubic;
}

.imgWrap {
overflow: hidden;	/*拡大時にはみ出た部分を隠す*/
width: 100%;	/*画像の幅*/
max-height: 100%;	/*画像の高さ*/
}
.imgWrap img {
display: block;
transition-duration: 0.3s;	/*変化に掛かる時間*/
}
.imgWrap img:hover {
transform: scale(1.1);	/*画像の拡大率*/
transition-duration: 0.3s;	/*変化に掛かる時間*/
}

/* ---------------------------------------------------------------------------------
* CONTENT RAYOUT
------------------------------------------------------------------------------------ */
article{
}
.post-inner{
/*ダミー
background:#FFD527;
*/
}

.post-header{
/*ダミー
background:#FBEF4C;
*/
}

.post-thumbnail{
margin-bottom:15px;
/*ダミー
background:#FDFC5D;
*/
}
.post-thumbnail img{
width:100%;
}

.post-content{
/*ダミー
background:#EBF88B;
*/
}

.post-cat{
/*ダミー
background:#ECFFBC;
*/
}

.post-bottom{ 
/*ダミー
background:#CDFDE1;
*/
} 
  　
.post-meta{
/*ダミー
background:#FFFCD7;
*/
}


/* ---------------------------------------------------------------------------------
* SINGLE  RAYOUT
------------------------------------------------------------------------------------ */
.single .main-inner,
.archive .main-inner{
padding:30px;
border: solid 1px #efefef;
}


.single .post-categories a{
padding:5px 30px;
background:#333;
color:#fff;
text-decoration:none;
margin-bottom:30px;
display:inline-block;
}

.single article{
background:#fff;
}


/* ---------------------------------------------------------------------------------
* PAGE RAYOUT
------------------------------------------------------------------------------------ */
.page .main-inner{
margin-right: 0 !important;
}

.page .post-categories a{
padding:5px 30px;
background:#333;
color:#fff;
text-decoration:none;
margin-bottom:30px;
display:inline-block;
}

.page article{
background:#fff;
}

/* SIDE TEMPLATE*/

.page-side .main-inner{
margin-right: 330px !important;
}

/* SIDE TEMPLATE*/

.page-contents .main-inner{
padding:30px;
border: solid 1px #efefef;
}
.page-contents .main-inner{
margin-right: 330px !important;
}


/* ---------------------------------------------------------------------------------
* ARCHIVE RAYOUT
------------------------------------------------------------------------------------ */
.archive article .cat-content{
background:#fff;
}

.archive .main-inner ul{
padding:0 !important;
margin-bottom:30px;
}

.archive .main-inner ul li{
background:url(lib/images/arrow.jpg) no-repeat left center;
margin-bottom:10px;
font-size:12px;
padding-left:20px;
list-style:none;
}

.archive .area01 ul{
margin-bottom:0px;
}

.archive .post-loop-wrap ul{
margin-bottom:0 !important;
}

.archive .post-loop-wrap ul li{
background:none;
margin-bottom:0 !important;
padding-left:0 !important;
}


/* ---------------------------------------------------------------------------------
* HEADER
------------------------------------------------------------------------------------ */

#header h1{
font-size:12px;
}
.header_sns{
font-size:12px;
text-align:right;
background: transparent;
}
.header_sns li{
margin-left:15px;
display:inline;
}
.header_sns li.instagram:before{
/*
content: "\f16d";
font-family: "Font Awesome 5 Brands";
*/
content: " ";
background-repeat: no-repeat;
background-image: url('https://jewelry-suehiro.co.jp/wp/wp-content/themes/BRAND_6.0.0/lib/images/font_awesome/instagram-brands.svg');
background-position: center;
background-size: 10.5px 13px;
padding:0px 10px;
margin-right: 10px;
}
.header_sns li.twitter:before{
/*
  font-family: "Font Awesome 5 Brands";
  content: '\f099';
*/
content: " ";
background-repeat: no-repeat;
background-image:url('https://jewelry-suehiro.co.jp/wp/wp-content/themes/BRAND_6.0.0/lib/images/font_awesome/twitter-brands.svg');
background-position: center;
background-size:12px 13px;
padding:0px 8px;
margin-right: 10px;
}
.header_sns li.facebook:before{
/*
content: "\f082";
font-family: "Font Awesome 5 Brands";
*/
content: " ";
background-repeat: no-repeat;
background-image:url('https://jewelry-suehiro.co.jp/wp/wp-content/themes/BRAND_6.0.0/lib/images/font_awesome/facebook-square-brands.svg');
background-position: center;
background-size:10.5px 13px;
padding:0px 8px;
margin-right: 10px;
}
.header_sns a{
color:#333;
text-decoration:none;
}

/*--header wrap--*/
.header-wrap{
clear: both;
position: relative;
width: 1200px;
height:75px;
margin: 0 auto;

display:grid;
grid-template-rows:75px;
grid-template-columns:180px 800px 230px;
grid-template-areas:
	"logo gnav nav_info"
;
}

/*--nav info--*/
.nav_info{
grid-area:nav_info;
display: flex;
}

.nav_info_item {
box-sizing:border-box;
height:45px;
margin:15px 0px 15px 5px;
padding:0px 10px;
display:inline-block;
line-height:45px;
vertical-align:middle;
background: #660025;
}

.nav_info_item a {
font-size:12px;
text-decoration:none;
color:#fff;
}

/*--nav reserve--*/
.nav_info a{
font-size:12px;
color:#fff;
text-decoration: none;
line-height: 200%;
}
.nav_info .reserve{
height:22px;
background: #660025;
margin-top:15px;
padding:5px 15px;
margin-right: 10px;
}

/* head logo */
.head_logo{
	grid-area:logo;
}

.logo{
height:45px;
padding:15px 0;
}

#header.is_fixed {
position: fixed;
z-index: 500000;
width: 100%;
}



/* ----------------------------------------
* gloval nav
---------------------------------------- */

/*--gmenu--*/
#gnav {
	grid-area:gnav;
}

#gnav ul {
	display:flex;
	flex-wrap:nowrap;
	justify-content:center;
}

#gnav ul li {
	display:inline-block;
	line-height:45px;
	vertical-align:middle;
	text-align:center;
	height:45px;
	padding:15px 10px;
}
#gnav ul li a {
	text-decoration:none;
	color:black;
}

#gnav ul li.gnav-item6{
width:160px;
}

#gnav ul li.gnav-item1{
width:70px;
}
#gnav ul li.gnav-item2{
width:80px;
}
#gnav ul li.gnav-item3{
width:90px;
}
#gnav ul li.gnav-item4{
width:50px;
}
#gnav ul li.gnav-item5{
width:95px;
}
#gnav ul li.gnav-item7{
width:115px;
}

#gnav ul li.gnav-item6 a:before{
/*
content: "\f07a";
font-family: "Font Awesome 5 Pro";
*/
content: "　";
background-repeat: no-repeat;
background-image: url('https://jewelry-suehiro.co.jp/wp/wp-content/themes/BRAND_6.0.0/lib/images/font_awesome/shopping-cart-solid.svg');
background-position: center;
background-size: 15.75px 15px;

margin-right: 10px;
}

/*--sub-menu--*/
#sub-nav{
background-color: rgba(255,255,255,1) ;
width: 100%;
z-index: 2000 !important;
position:fixed;
left: 0;
}
#sub-nav a{
text-decoration: none;
}
#sub-nav span{
display: block;
}
#sub-nav h2{
color:#000;
font-size:14px;
margin:15px 0 5px 0;
}
#sub-nav h2.subnav-title{
color:#000;
font-size:18px;
margin:15px 0 5px 0;
}
#sub-nav ul{
display:none;
width: 1200px;
margin: 0 auto;
padding:30px 0;
left: 0;
overflow: auto;
list-style: none;
}

#sub-nav ul li a{
color:#000 !important;
font-size:12px;
}

#sub-nav ul li{
float:left;
margin:0 20px 20px 0px;
width: 180px;
display: inline-block;
border-right:1px solid #eee;
padding-right:20px;
}

#sub-nav h2{
color: #660025;
}

#sub-nav .sub-wrap{
display:none;
width: 1200px;
margin: 0 auto;
padding:30px 0;
left: 0;
overflow: auto;
list-style: none;
}

#sub-nav .sub-wrap a{
color:#000 !important;
font-size:14px;
display: block;
margin-bottom:15px;
}

#sub-nav .sub-wrap-01{
float:left;
width:250px;
margin:0 20px 20px 0px;
border-right:1px solid #eee;
padding-right:20px;
}
#sub-nav .sub-wrap-02{
float:left;
width:400px;
margin:0 20px 20px 0px;
border-right:1px solid #eee;
padding-right:20px;
}
#sub-nav .sub-wrap-03{
float:left;
width:450px;
margin:0 0 20px 0px;
}


#sub-nav ul#sub-ul002 li{
height: 280px;
}

/*--smart_nav--*/
#menu{
margin-bottom:-10000px !important;
}

.nav_btn{
display: none;
}


/* ---------------------------------------------------------------------------------
* SIDE
------------------------------------------------------------------------------------ */
#side a{
color:#333;
}

#menu-side{
background:#fff;
padding:20px 10px 10px 10px;
border:solid 1px #dfdfdf;
overflow:auto;
}

#menu-side li{
background:url(lib/images/arrow.jpg) no-repeat left center;
margin-bottom:10px;
font-size:12px;
padding-left:20px;
}


/* ---------------------------------------------------------------------------------
* FOOTER
------------------------------------------------------------------------------------ */
#footer .footer-01{
width:25%;
float: left;
margin-right:5%;
}

#footer .footer-02{
width:25%;
float: left;
margin-right:5%;
}
#footer .footer-03{
width:25%;
float: left;
}
	
#footer .footer-01 a{
text-decoration: none;
color: #000;
}

#footer p{
font-size:12px;
margin-bottom:0;
}

#footer h3{
font-size:14px;
margin-bottom:0;
}

#footer .fmenu{
padding:30px 0;
margin-bottom:30px;
clear:both;
}

#footer .fmenu2{
padding:30px 0;
margin-bottom:30px;
background:#fff;
clear:both;
}

#footer .fmenu ul{
margin-top:10px;
}
#footer .fmenu ul li{
font-weight:500;
display: block;
margin:5px 0;
}

#footer .fmenu ul li a{
text-decoration:none;
color:#333;
margin-right:30px;
font-size:12px;
line-height: 150%;
}

#footer .sub-menu {
display: block !important;
border: none;
font-size: 12px;
}


#fnav-ul ul{
margin-left:15px;
}

.footer_insta{
background:url(lib/images/flat_instagram.png) no-repeat left center;
font-size:18px !important;
background-size:18px;
color:#000 !important;
padding-left:30px;
margin-bottom:15px !important;
text-align: left;
}

.footer_fb{
background:url(lib/images/flat_facebook.png) no-repeat left center;
font-size:18px !important;
background-size:18px;
color:#000 !important;
padding-left:30px;
margin-bottom:15px !important;
text-align: left;

}

.footer_twitter{
background:url(lib/images/flat_twitter.png) no-repeat left center;
font-size:18px !important;
background-size:18px;
color:#000 !important;
padding-left:30px;
margin-bottom:15px !important;
text-align: left;

}

/* ---------------------------------------------------------------------------------
* 共通
------------------------------------------------------------------------------------ */
.pc{
display:block;
}
.sp{
display:none;
}

a img:hover {
opacity: 0.5 ;
}

#content a:hover{
color:#660025;
}

/* breadcrumbs
---------------------------------------- */
#breadcrumb{
padding:30px 0 10px 0;
clear:both;
}
.breadcrumb {
overflow: hidden;
font-size: 12px;
line-height: 22px;
}
.breadcrumb li {
float: left;
margin-right: 10px;
list-style:none;
}
.breadcrumb li a {
text-decoration: none;
}
.breadcrumb li a:hover {
text-decoration: underline;
}


/* SNS ボタン
---------------------------------------- */
.sns_btn{
margin:30px 0;
}
.sns_btn span{
}
.sns_btn a{
text-decoration:none;
}
.sns_btn img{
width:30px;
margin-right: 15px;
}

.btn_twitter:hover:after,
.btn_facebook:hover:after,
.btn_hatebu:hover:after,
.btn_googleplus:hover:after,
.btn_line:hover:after{
opacity:0.7;
}


/* ----------------------------------------
* CTA
---------------------------------------- */
.post-cta {
background: #f5f5f5;
color: #383838;
border-top: 3px solid #5e6265;
border-left:solid 1px #e2e2e2;
border-right:solid 1px #e2e2e2;
border-bottom:solid 1px #e2e2e2;
}
.post-cta .post-cta-inner {
padding: 30px;
}
.post-cta .cta-post-title {
padding: 15px 30px;
font-size: 32px;
border-bottom: 1px solid #e5e5e5;
}
.post-cta img {
 margin:0 !important;
}
.post-cta .post-cta-cont {
overflow: hidden;
}
.post-cta .post-cta-btn {
margin: 30px 0 10px;
}
.post-cta .post-cta-btn a {
background: #5ace5f;
color: #fff;
border-radius: 3px;
border-bottom: 5px solid #38bd3e;
display: block;
padding: 10px;
text-align: center;
text-decoration: none;
width: 60%;
margin: 0 auto 20px;
}
.post-cta .post-cta-btn a:hover {
background: #81da85;
border-bottom: 5px solid #5ace5f;
}
.post-cta .btn {
width: 100%;
display: block;
border-radius: 3px;
text-align: center;
color: #fff;
padding: 14px 0;
-webkit-transition: background .3s ease-in-out;
transition: background .3s ease-in-out;
background: #2581c4;
}
.post-cta .btn:hover {
text-decoration: none;
background: #f24e4f;
}

/* pagetop
---------------------------------------- */
.pagetop {
visibility: hidden;
opacity: 0;
position: fixed;
bottom: 10px;
right: 50px;
color: #fff;
text-decoration:none;
z-index: 2;
}
.pagetop span {
display: block;
background: #2b2b2b;
width: 100px;
text-align: center;
font-size: 12px;
padding:5px 0;
}

.pagetop.show {
visibility: visible;
opacity: 0.8;
}

/* pagenation
---------------------------------------- */
.pagination{
clear:both;
overflow:auto;
display:block;
padding:15px 0;
}
.pagination span, .pagination a {
padding: 12px 10px;
color: #383838;
font-weight:bold;
text-decoration:none;
margin-right:5px;
}
.pagination a:hover {
padding: 12px 10px;
color: #383838;
border-bottom:solid 1px #383838;
font-weight:bold;
}
.pagination .current {
padding: 12px 10px;
color: #383838;
border-bottom:solid 1px #383838;
font-weight:bold;
}
.pagination .inactive{
color: #383838 !important;
}

/* bucknumber
---------------------------------------- */
.backnumber{
border-top:solid 1px #efefef;
border-bottom:solid 1px #efefef;
padding:15px 0;
overflow:auto;
}
.backnumber ul{
margin:0;
padding:0;
margin-top:10px;
}
.backnumber ul li{
list-style:none;
margin-bottom:10px;
font-size:14px;
}
.titleBN{
font-weight:bold;
}
.titleBN:before{
/*
content: "\f02d";
font-family: 'Font Awesome 5 Free';
*/
content : "　";
background-repeat: no-repeat;
background-image: url('https://jewelry-suehiro.co.jp/wp/wp-content/themes/BRAND_6.0.0/lib/images/font_awesome/book-solid.svg');
background-position: center;
background-size: 9px 12px;

padding:0 10px 0 0;
}
.listBN{
float:right;
text-decoration:underline;
}

/* tab
---------------------------------------- */
.single .tab{
margin:30px 0 0 0;
padding:0;
}

.single .tab li{
float:left; 
list-style:none;
padding:5px 30px;
font-size:12px;
border-top:solid 1px #efefef;
border-right:solid 1px #efefef;
border-left:solid 1px #efefef;
background:#fff;
}

.single .tab li.select{
background:#000;
color:#fff;
}

.single .tab-inner{
margin:0;
padding:10px ;
clear:both;
background:#fff;
overflow:auto;
}

.single .tab-inner div{
list-style:none;
}

.single .hide {
display:none;
}


/* author
---------------------------------------- */
.author-area{
clear:both;
}
.author-inner{
padding:15px;
}
.author-area img{
float:left;
width:15%;
margin:0 15px 0 0;
}
.post-author-meta{
float:left;
width:80%;
}
.author-area p{
font-size:14px;
}
.author-area h5{
font-weight:bold;
}
.author-area a{
color:#000;
text-decoration: none;
}

.author_sns{
margin:15px 0;
}

/* sc_author
---------------------------------------- */
.authorBoxSC{
clear:both;
border:solid 1px #e9e9e9;
padding:2%;
overflow: auto;
margin-bottom: 15px;
}
.authorBox01{
clear: both;
}
.authorBox04{
float:left;
width:15%;
margin-right:2%;
margin-top:1%;
}
p.authortext{
font-size:10px !important;
}
/* head-avatar
---------------------------------------- */
.head-avatar{
font-size:14px;
}
.head-avatar img{
margin-right:15px;
}
.head-avatar a{
text-decoration: none;
}

/* toc
---------------------------------------- */
#toc_container {
width:96% !important;
margin:15px 0 0 0;
border:solid 1px #ccc !important;
}
#toc_container {
padding:2% !important;
}



/* ---------------------------------------------------------------------------------
* PAGE TOP
------------------------------------------------------------------------------------ */

