
@charset utf-8;



/** ================================================================================================



	Star Brides 2019 SUMMER Pre-Opening Issue CSS

	@version 1.0   2019.6.24 New
	@version 2.0   2020.7.29 Ã©â€ºâ€ Ã§Â´â€ž


	01. Ã£â€šÂ¹Ã£â€šÂ¿Ã£Æ’Â¼Ã£â€šÂ¸Ã£Æ’Â¥Ã£â€šÂ¨Ã£Æ’ÂªÃ£Æ’Â¼Ã£Æ’â€“Ã£Æ’Â©Ã£â€šÂ¤Ã£Æ’â‚¬Ã£Æ’Â« hack







	Ã£Æ’â€“Ã£Æ’Â©Ã£â€šÂ¤Ã£Æ’â‚¬Ã£Æ’Â«Ã£Æ’â€¢Ã£Æ’Æ’Ã£â€šÂ¿Ã£Æ’Â¼    .sjBridalFooter



==================================================================================================== **/



/* debug */

del {
	text-decoration: line-through;
    color:#ff0000;
}



/** ============================================================================


	Star Jewelry Bridal Hack


================================================================================ **/



.header {
    position:relative;
    z-index:1200;
}


/* for Tablet ========================================== */

@media screen and (max-width: 1023px) {

}



/* for Smart Phone ===================================== */

@media (max-width: 768px) {

}



/** ============================================================================


	Star Brides Page Common (reset)


================================================================================ **/



.sbPage {
	top:-40px;
	display:block;
	position:relative;
	margin:0;
	/* padding:0px 0 100px 0; */
	font-family:'Noto Sans JP', 'Yu Gothic Medium', 'Hiragino Kaku Gothic Pro', Meiryo, sans-serif;
	font-size:14px;
	font-weight:400;
	line-height:1.8;
}


.sbPage header {
    z-index: 10;
    max-width: none;
    width: auto;
    margin: 0;
    font-weight: 400;
}

.sjb-header01 .sbPage header,
.sjb-header02 .sbPage header,
.sjb-header03 .sbPage header,
.sjb-header04 .sbPage header {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
}



/* for Tablet & Smart Phone ===================================== */

@media screen and (max-width: 1023px) {

    .sbPage {
		top:20px;
        padding:0 0 110px 0;
    }
}


/* for Smart Phone ============================================== */

@media screen and (max-width: 768px) {
    
    .sbPage {
        padding:0;
    }
}



/** ============================================================================


	Star Brides Common Header


================================================================================ **/


#sbHeader {
    display: block;
    position: fixed;
	right: 0px;
    top: 0px;
    /* right: 10px; */
    /* top:140px; */
    width: 300px;
    margin: 0;
    padding: 0;
    background-color:rgba(255,255,255,0.9);
    border:1px solid #d0d0d0;
	border:1px solid #ffffff;
    z-index:900;
    transition: all 1s ease-in-out;
}

#sbHeader a {
	text-decoration:none;
}


#sbHeader .inner {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    position: relative;
    margin: 0 auto;
    padding: 0;
}

#sbHeader h1 {
    display:block;
    position:relative;
    width: 80%;
    margin:0;
    padding:0;
    box-sizing: border-box;
    
    font-family: "Cormorant Garamond", serif;
    font-size:20px;
    font-weight:400;
    text-align: center;
    
    transition: all 1s ease-in-out;
}

#sbHeader h1 strong {
    font-size: 24px;
    font-weight: 400;
}

/*
#sbHeader h1 img {
    display:block;
    width:80%;
    height:auto;
    margin:0 auto;
    vertical-align:bottom;
    max-width:none;
}
*/


/* MENU Button ----------------------------------------- */

#sbHeader .menubtn {
    display: block;
    position: relative;
    width: 20%;
    margin:0;
    padding: 0;
    box-sizing: border-box;
    
    transition: all 1s ease-in-out;
}

#sbHeader .menubtn > a {
    display:block;
    position:relative;
    height:45px;
    margin:0;
    padding:30px 0 0 0;
padding: 5px 0 0 0;
    box-sizing:border-box;
    cursor:pointer;
    background-color: transparent;
/* background-color:#ffffff; */
}

#sbHeader .menubtn > a img {
    display:block;
    position:relative;
    width: 25px;
    height: 25px;
    margin: 0 auto 2px;
    padding: 0;
    vertical-align: bottom;
}

#sbHeader .menubtn > a::after {
    content:"MENU";
    display:block;
    position:relative;
    margin:0;
    padding:0;

    color:#231815;
    font-size:10px;
    font-weight:400;
    line-height:1;
    letter-spacing:0.05em;
    text-align:center;
    transition:all 0.8s ease-in-out;
}

Ã£Ââ€œÃ£ÂÂ®Ã£â€šÂ³Ã£Æ’Â¡Ã£Æ’Â³Ã£Æ’Ë†Ã¥Ââ€“Ã£â€šâ€¹
.sbNav li.menu > a span {
    background-color:transparent;
}


.sbPage.openSbNav #sbHeader .menubtn {
    float:right;
    margin:0;
    transition:all 0.8s ease-in-out;
}

.sbPage.scrolled #sbHeader {
    position:fixed;
    top:-1px;
}


/* for Tablet & Smart Phone ===================================== */

@media screen and (max-width: 1023px) {

    #sbHeader {
		right: 0px;
        top:0px;
    }
    
    .sbPage.scrolled #sbHeader {
        top:90px;
    }
}



/** Responsive for Smart Phone --------------------------------------- **/

@media all and (max-width: 768px) {

    #sbHeader {
        right:0;
		top:0;
        width:100%;
        border-left-width: 0;
        border-right-width: 0;
    }
    
    #sbHeader h1 {
        width:60%;
        margin-left: 20%;
        
        border:1ox sikud #ff9999;
        white-space: nowrap;
    }  
    
    #sbHeader h1 img {
        width:80%;
        max-width: 200px;
    }  
    
    .sbPage.scrolled #sbHeader {
        top:64px;
        width: 70px;
        border-left-width: 1px;
    }
    
    .sbPage.scrolled #sbHeader h1 {
        width: 1%;
        margin-left: 0;
        opacity: 0;
    }    

    .sbPage.scrolled #sbHeader .menubtn {
        width: 99%;
    }

    .sbPage.scrolled #sbHeader .menubtn > a::after {
        content:"COLUMN";
    }
}



/** ============================================================================


	Star Brides 


================================================================================ **/



.sbNav {
    display:block;
    position:fixed;
    left:100%;
    top:0;
    width:100%;
    height:100%;
    margin:0;
    padding:0;
    box-sizing:border-box;
    z-index:2000;

    background-color:transparent;
    transition:all 0.8s ease-in-out;
}



/* Reset ----------------------------------------------- */

.sbNav a {
    transition:all 0.5s linear;
    text-decoration:none;
}

.sbNav a:link    { color:#231815; }
.sbNav a:visited { color:#231815; }
.sbNav a:hover   { color:#69307c; }
.sbNav a:active  { color:#69307c; }



/* Clickable Background -------------------------------- */

.sbNav > .bg {
    left:0;
    top:0;
    width:100%;
    height:100%;
    background-color:rgba(215,194,221,0.8);
    cursor:pointer;
}


/* inner layer ----------------------------------------- */

.sbNav > .inner {
	display:block;
	position:absolute;
    right:0;
    top:0;
	width:500px;
	height:100%;
	margin:0;
	padding:30px 30px 100px;
	box-sizing:border-box;

	overflow:auto;
	overflow-x:hidden;
	overflow-y:auto;
    background-color: #ffffff;
}


/* Content Layer --------------------------------------- */

.sbNav > .menu {
    display: block;
    position: absolute;
	right:520px;
	top:20px;
    width:50px;
}

.sbNav > .menu a {
    display: block;
    position: relative;
	margin:0;
	padding:30px 0 0 0;
	box-sizing:border-box;
	cursor:pointer;
    color:#
}

.sbNav > .menu a span {
	display:block;
	position:absolute;
    left: 50%;
    top:15px;
    width: 30px;
    height: 1px;
	margin:0 0 0 -15px;
	padding:0;
	background-color:#231815;
	transform-origin:center center;
	transition:all 0.8s ease-in-out;
}
.sbNav > .menu a span:nth-of-type(1) { transform: translateY(-8px); }
.sbNav > .menu a span:nth-of-type(2) { transform: translateY(0px); }
.sbNav > .menu a span:nth-of-type(3) { transform: translateY(8px); }

.sbNav > .menu > a::after {
	content:"CLOSE";
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
	color:#231815;
	font-size:10px;
	font-weight:400;
	line-height:1;
	letter-spacing:0.05em;
	text-align:center;
	transition:all 0.8s ease-in-out;
}



/* open menu (Ã£Æ’Â¡Ã£Æ’â€¹Ã£Æ’Â¥Ã£Æ’Â¼Ã£ÂÅ’Ã©â€“â€¹Ã£Ââ€žÃ£ÂÂ¦Ã£Ââ€žÃ£â€šâ€¹Ã§Å Â¶Ã¦â€¦â€¹) ---------------- */

.sbPage.openSbNav .sbNav {
    left:0;
}

.sbPage.openSbNav .sbNav > .menu a span:nth-of-type(1) { transform: translateY(0px) rotate(45deg); }
.sbPage.openSbNav .sbNav > .menu a span:nth-of-type(2) { opacity:0; }
.sbPage.openSbNav .sbNav > .menu a span:nth-of-type(3) { transform: translateY(0px) rotate(-45deg); }

/*
.sbPage.openSbNav .sbNav > .menu a::after {
    content:"CLOSE";
    color:#ffffff;
}
*/


/** Responsive for Smart Phone --------------------------------------------- **/



@media all and (max-width: 767px) {


    /* inner layer ----------------------------------------- */

    .sbNav > .inner {
        width:100%;
        padding: 20px;
    }


    /* Content Layer --------------------------------------- */

    .sbNav > .menu {
        right:10px;
        top:10px;
    }
    
    .sbPage.openSbNav .sbNav > .menu a span {
        background-color:#231815;
    }

    .sbPage.openSbNav .sbNav > .menu a::after {
      color:#231815;
    }
}




/** ============================================================================


	Ã£â€šÂµÃ£â€šÂ¤Ã£Æ’â€°Ã£Æ’Å Ã£Æ’â€œ01. HOMEÃ£Æ’Å Ã£Æ’â€œ


================================================================================ **/



.homeNav {
    display:block;
    position:relative;
    margin:40px 0 0 0;
    padding:0;
    text-align:center;
}

.homeNav > ul {
    display:flex;
    flex-direction:row-reverse;
    flex-wrap:nowrap;
    align-items:stretch;
    position:relative;
    margin:0;
    padding:0;
}

.homeNav > ul > li {
    display:block;
    position:relative;
    width:50%;
    margin:0;
    padding:10px;
    list-style-type:none;
    box-sizing:border-box;
}

.homeNav > ul > li.bridal {
    border:1px solid #e0e0e0;
    border-right:0;
    border-top:0;
/*		background-color:#f5f5f5; */
}

.homeNav img {
    display:block;
    width:70%;
    max-width:150px;
    height:auto;
    margin:0 auto 10px;
    vertical-align:bottom;
}

.homeNav > ul > li.brides img {
    width: 80%;
    max-width: 80%;
}



/** ===========================================================================


    Ã¦â€“Â°Ã§Ââ‚¬Ã£â€šÂ¨Ã£Æ’Â³Ã£Æ’Ë†Ã£Æ’ÂªÃ£Æ’Â¼Ã£Æ’Å Ã£Æ’â€œ


=============================================================================== **/


.newEntriesNav {
    display:block;
    position:relative;
    margin:50px 0 0 0;
    padding:0;
    
    font-size:14px;
    font-weight: 300;
}

.hashtagNav > h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size:20px;
    font-weight: 500;
    line-height: 1.3;
}

.hashtagNav > h4 {
    display: block;
    margin: 0;
    padding: 0;
    font-size:12px;
    font-weight: 300;
}



.newEntriesNav li {
    margin: 10px 0 0 0;
    padding: 0;
    list-style-type: none;
}

.newEntriesNav dl {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    margin: 0;
    padding: 0;
}

.newEntriesNav dt {
    width: 30%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.newEntriesNav dt img {
    width: 100%;
    vertical-align: bottom;
}

.newEntriesNav dd {
    width: 70%;
    margin: 0;
    padding: 0 0 0 10px;
    box-sizing: border-box;
}

.newEntriesNav h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size:20px;
    font-weight: 500;
    line-height: 1.3;
}

.newEntriesNav h3 strong {
    font-size:22px;
}



/* Responsive for Smart Phone -------------------------------- */

@media all and (max-width: 768px) {
    
    .newEntriesNav dd {
        font-size: 12px;
    }
    
    .newEntriesNav h3 {
        font-size:16px;
    }

    .newEntriesNav h3 strong {
        font-size:18px;
    }
    
}





/** ============================================================================


	Hashtag Nav


================================================================================ **/


.hashtagNav {
    display:block;
    position:relative;
    margin:50px 0 0 0;
    padding:0;
    
    font-size:14px;
    font-weight: 300;
}

.hashtagNav ul,
.hashtagNav li,
.hashtagNav dl,
.hashtagNav dt,
.hashtagNav dd {
    margin: 0;
    padding: 0;
    list-style-type: none;
    box-sizing: border-box;
}


.hashtagNav dt {
    font-family: 'Cormorant Garamond', serif;
    font-size:20px;
    font-weight: 500;
    line-height: 1.3;
}

.hashtagNav dt strong {
    font-size:24px;
    font-weight: 500;
}

.hashtagNav dd {
    font-size:12px;
    font-weight: 300;
    line-height: 1.3;
}


/* Ã§Â¬Â¬Ã¤Â¸â‚¬Ã©Å¡Å½Ã¥Â±Â¤(hashtag) */

.hashtagNav li.hasChild > a {
    display: block;
    position: relative;
    margin: 0;
    padding: 10px 0 10px 20px;
    cursor:pointer;
}
.hashtagNav li.hasChild > a::before,
.hashtagNav li.hasChild > a::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top:50%;
    width: 10px;
    height: 1px;
    margin: 0;
    padding: 0;
    background-color:#222222;
    transition: all 0.5s;
}
.hashtagNav li.hasChild > a::before { transform: rotate(-90deg); }
.hashtagNav li.hasChild > a::after  { transform: rotate(  0deg); }







/* Ã§Â¬Â¬2Ã©Å¡Å½Ã¥Â±Â¤Ã¯Â¼Ë†Ã¥â€¢â€ Ã¥â€œÂÃ¯Â¼â€° */

.hashtagNav div div {
    padding: 0;
    margin: 0 0 0 20px;
    max-height: 0;
    overflow: hidden;
    transition: all 0.5s ease-in-out;
}

.hashtagNav div div li {
    border-top:1px dotted #aaa;
}

.hashtagNav div div ul {
    border-bottom:1px dotted #aaa;
}
.hashtagNav div div dt {
    font-size:14px;
}

.hashtagNav div div dt strong {
    font-size:16px;
}

.hashtagNav a[href] {
    display: block;
    position: relative;
    padding:10px 0 10px 20px;
}
.hashtagNav a[href]::before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top:50%;
    width: 6px;
    height: 6px;
    margin: 0;
    padding: 0;
    border-top:1px solid #222222;
    border-right: 1px solid #222222;
    transform: translateY(-50%) rotate(45deg);
}


/* open */

.hashtagNav div li.open div {
    max-height: 2000px;
}
.hashtagNav li.hasChild.open > a::before { transform: rotate(0deg); opacity: 0; }



/* issue01-04 */
.hashtagNav .issue {
    border-top:1px dotted #aaa;
}

.hashtagNav .issue a[href] {
    display: block;
    position: relative;
    padding:10px 0 10px 20px;
}
.hashtagNav .issue a[href]::before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top:50%;
    width: 6px;
    height: 6px;
    margin: 0;
    padding: 0;
    border-top:1px solid #222222;
    border-right: 1px solid #222222;
    transform: translateY(-50%) rotate(45deg);
}

.hashtagNav .issue dl {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
}

.hashtagNav .issue dt {
    width: 20%;
}

.hashtagNav .issue dt img {
    width: 100%;
	vertical-align:bottom;
}

.hashtagNav .issue dd {
    width: 80%;
    padding: 0 0 0 10px;
    box-sizing: border-box;
    
    font-family: 'Cormorant Garamond', serif;
    font-size:18px;
    font-weight: 500;
}


/* open */

.hashtagNav .hasChild.open > div {
    max-height: 2000px;
}
.hashtagNav .hasChild.open > a::before { transform: rotate(0deg); opacity: 0; }




/* Responsive for Smart Phone ============================ **/

@media all and (max-width: 768px) {
    
    
    
    
    
    
    
}



/** ============================================================================


	Star Brides Article Common


================================================================================ **/


	.sbArticle {
		display:block;
		position:relative;
		margin:0;
		padding:0;

		color:#231815;
		font-family:'Noto Sans JP', 'Yu Gothic Medium', 'Hiragino Kaku Gothic Pro', Meiryo, sans-serif;
		font-size:14px;
		font-weight:400;
		line-height:1.8;

		background-color:#ffffff;
	}
	.sbArticle::after { content:"."; display:block; height:0; clear:both; visibility:hidden; }


/* Responsive for Smart Phone -------------------------------- */


@media all and (max-width: 768px) {
	.sbArticle {
		padding-top:0px;
	}
}


/** ============================================================================



	/* Reset ----------------------------------------------- */

	.sbArticle a { trasition:color 0.2s linear; }
	.sbArticle a:link,
	.sbArticle a:visited { color:#662f76; text-decoration:none; }
	.sbArticle a:hover,
	.sbArticle a:active  { color:#702d4d; text-decoration:none; }

	.sbArticle img {
		width:auto;
		max-width:100%;
		border:0;
	}

	.sbArticle ul,
	.sbArticle li,
	.sbArticle dl,
	.sbArticle dt,
	.sbArticle dd {
		margin:0;
		padding:0;
		list-style-type:none;

		font-family:'Noto Sans JP', 'Yu Gothic Medium', 'Hiragino Kaku Gothic Pro', Meiryo, sans-serif;
		font-size:inherit;
		letter-spacing:normal;
	}

	.sbArticle h1,
	.sbArticle h2,
	.sbArticle h3,
	.sbArticle h4,
	.sbArticle h5,
	.sbArticle h6 {
		margin:0;
		padding:0;

		font-family:'Noto Sans JP', 'Yu Gothic Medium', 'Hiragino Kaku Gothic Pro', Meiryo, sans-serif;
		font-size:inherit;
		letter-spacing:normal;
	}

	.sbArticle p {
		margin:1em 0;

		font-family:'Noto Sans JP', 'Yu Gothic Medium', 'Hiragino Kaku Gothic Pro', Meiryo, sans-serif;
		font-size:inherit;
		letter-spacing:normal;
	}



	/* Header ---------------------------------------------- */

	.sbArticle > header {
		display:flex;
		flex-direction:row;
		flex-wrap:nowrap;
		align-items:center;

		position:relative;
		width:100%;
		margin:0;
		padding:0;
		box-sizing:border-box;
		background-color:#f5f5f5
	}
	.sbArticle > header::after { content:"."; display:block; height:0; clear:both; visibility:hidden; }


	.sbArticle > header .image {
		position:relative;
		width:55%;
		margin:0 0 0 5%;
		padding:0;
		box-sizing:border-box;
	}
	.sbArticle > header .image img {
		width:100%;
		max-width:none;
		height:auto;
		vertical-align:bottom;
	}


	.sbArticle > header .text {
		position:relative;
		width:45%;
		margin:0;
		padding:0 30px;
		box-sizing:border-box;
	}

	.sbArticle > header h1 {
		margin:0;
		padding:0;
		font-family:"Cormorant Garamond";
		font-weight:500;
		font-size:24px;
		letter-spacing:0.1em;
		line-height:1.2;
	}

	.sbArticle > header h1 strong {
		font-weight:500;
		font-size:28px;
	}

	.sbArticle > header h2 {
		margin:10px 0 0 0;
		padding:0;
		font-weight:400;
		font-size:18px;
		line-height:1.4;
	}




	.sbArticle > header .scroll {
		display:block;
		position:absolute;
		margin:0;
		padding:25px 0 0 0;

		color:#888888;
		text-align:center;
		font-size:12px;
		line-height:1;
		z-index:100;
	}

	.sbArticle > header .scroll::after {
		content:"";
		display:block;
		position:absolute;
		top:-10px;
		left:50%;
		width:20px;
		height:20px;
		margin:0 0 0 -10px;
		padding:0;

		border:1px solid #888888;
		transform:rotate(45deg);

		border-left-color:transparent;
		border-top-color:transparent;
	}


	/* white scroll */
	.sbArticle > header .scroll.white {
		color:#ffffff;
	}

	.sbArticle > header .scroll.white::after {
		border-color:#ffffff;
		border-left-color:transparent;
		border-top-color:transparent;
	}




	/* Lead ------------------------------------------------ */

	.sbArticle .lead {
		display:block;
		position:relative;
		margin:30px 0 0;
		padding:0;
		font-size:16px;
		font-weight:300;
		line-height:1.8;
	}



	/* Credit ---------------------------------------------- */

/*
	.sbArticle .credit {
		display:block;
		position:relative;
		width:calc( 100% - 100px );
		max-width:1200px;
		margin:50px auto 0;
		padding:0;

		color:#888888;
		font-size:10px;
		font-weight:400;
		line-height:1.3;
	}
	.sbArticle .credit::after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

	.sbArticle .credit ul {
		float:right;
		margin:0;
		padding:0;
	}

	.sbArticle .credit li {
		position:relative;
		margin:2px 0;
		padding:0 0 0 1em;
		white-space:nowrap;
	}

	.sbArticle .credit li.hearst {
		margin:10px 0 0 0;
	}

	.sbArticle .credit li.hearst img {
		width:150px;
		padding-left:0.5em;
		vertical-align:baseline;
	}
*/


/** ============================================================================


	Star Brides Section Common


================================================================================ **/



	.sbSection {
		display:block;
		position:relative;
		width:calc( 100% - 100px );
		max-width:1200px;
		margin:150px auto 0;
		padding:0;
		box-sizing:border-box;
	}
	.sbArticle section::after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

	.sbSection > header {
		display:block;
		position:relative;
		margin:0;
		padding:0;
		text-align:center;
		color:#231815;
	}

	.sbSection > header h1,
	.sbSection > header h2 {
		font-size:18px;
		font-weight:300;
	}




	/* Reset ----------------------------------------------- */

	.sbSection a { trasition:color 0.2s linear; }
	.sbSection a:link,
	.sbSection a:visited { color:#662f76; text-decoration:none; }
	.sbSection a:hover,
	.sbSection a:active  { color:#702d4d; text-decoration:none; }

	.sbSection img {
		width:auto;
		max-width:100%;
		border:0;
	}

	.sbSection ul,
	.sbSection li,
	.sbSection dl,
	.sbSection dt,
	.sbSection dd {
		margin:0;
		padding:0;
		list-style-type:none;

		font-family:'Noto Sans JP', 'Yu Gothic Medium', 'Hiragino Kaku Gothic Pro', Meiryo, sans-serif;
		font-size:inherit;
		letter-spacing:normal;
	}

	.sbSection h1,
	.sbSection h2,
	.sbSection h3,
	.sbSection h4,
	.sbSection h5,
	.sbSection h6 {
		margin:0;
		padding:0;

		font-family:'Noto Sans JP', 'Yu Gothic Medium', 'Hiragino Kaku Gothic Pro', Meiryo, sans-serif;
		font-size:inherit;
		letter-spacing:normal;
	}

	.sbSection p {
		margin:1em 0;

		font-family:'Noto Sans JP', 'Yu Gothic Medium', 'Hiragino Kaku Gothic Pro', Meiryo, sans-serif;
		font-size:inherit;
		letter-spacing:normal;
	}



/** ============================================================================


	Star brides ASide Common


================================================================================= **/



	.sbAside {
		display:block;
		position:relative;
		width:calc( 100% - 100px );
		max-width:1200px;
		margin:150px auto 0;
		padding:0;
		box-sizing:border-box;

		font-family:'Noto Sans JP', 'Yu Gothic Medium', 'Hiragino Kaku Gothic Pro', Meiryo, sans-serif;
		font-size:14px;
		font-weight:400;
		line-height:1.8;
		color:#958350;
		background-color:#ff0000;
	}
	.sbAside::after { content:"."; display:block; height:0; clear:both; visibility:hidden; }



	/* Reset ----------------------------------------------- */


	.sbAside a { trasition:color 0.2s linear; }
	.sbAside a:link,
	.sbAside a:visited { color:#662f76; text-decoration:none; }
	.sbAside a:hover,
	.sbAside a:active  { color:#702d4d; text-decoration:none; }

	.sbAside img {
		width:auto;
		max-width:100%;
		border:0;
	}

	.sbAside ul,
	.sbAside li,
	.sbAside dl,
	.sbAside dt,
	.sbAside dd {
		margin:0;
		padding:0;
		list-style-type:none;

		font-family:'Noto Sans JP', 'Yu Gothic Medium', 'Hiragino Kaku Gothic Pro', Meiryo, sans-serif;
		font-size:inherit;
		letter-spacing:normal;
	}

	.sbAside h1,
	.sbAside h2,
	.sbAside h3,
	.sbAside h4,
	.sbAside h5,
	.sbAside h6 {
		margin:0;
		padding:0;

		font-family:'Noto Sans JP', 'Yu Gothic Medium', 'Hiragino Kaku Gothic Pro', Meiryo, sans-serif;
		font-size:inherit;
		letter-spacing:normal;
	}

	.sbAside p {
		margin:1em 0;

		font-family:'Noto Sans JP', 'Yu Gothic Medium', 'Hiragino Kaku Gothic Pro', Meiryo, sans-serif;
		font-size:inherit;
		letter-spacing:normal;
	}




/** ============================================================================


	Common : Ã¦â€”Â§Ã£Æ’Å¡Ã£Æ’Â¼Ã£â€šÂ¸Ã£Æ’Å Ã£Æ’â€œÃ£â€šÂ²Ã£Æ’Â¼Ã£â€šÂ·Ã£Æ’Â§Ã£Æ’Â³


================================================================================ **/



.sbPageNav {
    display: none;
}



/** ============================================================================


	Ã¦â€“Â°Ã£Æ’Å¡Ã£Æ’Â¼Ã£â€šÂ¸Ã£Æ’Å Ã£Æ’â€œÃ£â€šÂ²Ã£Æ’Â¼Ã£â€šÂ·Ã£Æ’Â§Ã£Æ’Â³


================================================================================ **/



.relPages {
    display:block;
    position:relative;
    width:auto;
    width: calc(100% - 100px);
    max-width:1000px;
    margin:100px auto 0;
    padding:0;

    font-family:'Noto Sans JP', 'Yu Gothic Medium', 'Hiragino Kaku Gothic Pro', Meiryo, sans-serif;
    font-size:14px;
    font-weight:300;
    line-height:1.8;
}


.relPages a {
    text-decoration:none;
    transition:all 0.3s ease-in-out;
}
.relPages a:link,
.relPages a:visited,
.relPages a:hover
.relPages a:active { color:#231815; }


.relPages > ul {
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: center;
    margin: 0;
    padding: 0;
}

.relPages > ul > li {
    width: 33.3%;
    margin: 0;
    padding: 0 10px;
    list-style-type: none;
    box-sizing: border-box;
/*
    border-top: 1px solid #222222;
    border-bottom: 1px solid #222222;
*/
}


.relPages dl {
    margin: 0;
    padding: 0;
}

.relPages dt {
    display: block;
    position: relative;
    margin: 0;
    padding: 5px 0;
    
    font-family:'Cormorant Garamond', serif;
    font-weight:500;
    font-size:22px;
    letter-spacing:0.1em;
    line-height:1;
}
.relPages dt::after {
    content:"";
    display: block;
    position: absolute;
    width: 10px;
    height: 10px;
    margin: 0;
    padding: 0;
    border-top:1px solid #222222;
    border-right:1px solid #222222;
}

.relPages dd {
    margin: 5px 0 0 0;
    padding: 0;
}



.relPages > ul > li.prv { text-align: right; }
.relPages > ul > li.prv dt { padding-right: 20px; }
.relPages > ul > li.prv dt::after { top:50%; right:0; transform: translateY(-50%) rotate(-135deg); }

.relPages > ul > li.hme { text-align: center; }
.relPages > ul > li.hme dt::after { bottom:100%; left:50%; transform: translateX(-50%) rotate(-45deg); }
.relPages > ul > li.hme dd {
    font-family:'Cormorant Garamond', serif;
    font-weight:400;
    font-size:16px;
}
.relPages > ul > li.hme dd strong {
    font-weight:400;
    font-size:18px;
}
.relPages > ul > li.nxt { text-align: left; }
.relPages > ul > li.nxt dt { padding-left: 20px; }
.relPages > ul > li.nxt dt::after { top:50%; left:0; transform: translateY(-50%) rotate(45deg); }



/** Responsive for Smart Phone --------------------------------------------- **/

@media all and (max-width: 767px) {

    
    .relPages {
        width:auto;
        max-width:none;
        margin:100px 20px 0;
        font-size:12px;
    }

    .relPages > ul > li {
        padding: 0 5px;
    }

    .relPages dt {
        font-size:18px;
    }
    .relPages dt::after {
        width: 6px;
        height: 6px;
    }

    .relPages dd {
        display: none;
    }
}




/** ================================================================================================


	Related Posts Ã©â€“Â¢Ã©â‚¬Â£Ã£â€šÂ³Ã£Æ’Â³Ã£Æ’â€ Ã£Æ’Â³Ã£Æ’â€ž


===================================================================================================== **/



	.relPosts {
		display:block;
		position:relative;
		width:calc( 100% - 100px );
		max-width:1200px;
		margin:100px auto 0;
		padding:0;
	}

	.relPosts > header {
		display:block;
		position:relative;
		margin:0;
		padding:15px 0 0 0;
		text-align:center;
	}
	.relPosts > header::before {
		content:"";
		display:block;
		position:absolute;
		left:50%;
		top:0;
		width:40px;
		height:2px;
		margin:0 0 0 -20px;
		padding:0;
		background-color:#d5c7df;
	}

	.relPosts > header h1 {
		margin:0;
		padding:0;
		font-family:'Cormorant Garamond', serif;
		font-weight:500;
		font-size:20px;
		letter-spacing:0.1em;
		line-height:1;
	}

	.relPosts > header h1 strong {
		font-weight:500;
		font-size:24px;
	}

	.relPosts > header h2 {
		font-weight:400;
		font-size:14px;
	}

	.relPosts .posts {
		display:block;
		position:relative;
		margin:0;
		padding:0;
	}

	.relPosts .posts ul {
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;
		justify-content:center;
		margin:0;
		padding:0;
	}

	.relPosts .posts li {
		width:19%;
		margin:10px 0.5% 0;
		padding:0;
		box-sizing:border-box;
	}

	.relPosts .posts dl {
		display:block;
		position:relative;
		margin:0;
		padding:0;
	}

	.relPosts .posts dt {
		display:block;
		position:relative;
		margin:0 10px 0 0;
		padding:0;
		border:1px solid #ede8f1;
		border-right:0;
		border-bottom:0;
	}

	.relPosts .posts dt.image img {
		width:100%;
		max-width:none;
		height:auto;
		vertical-align:bottom;
	}

	.relPosts .posts dd {
		display:block;
		position:relative;
		margin:-10px 0 0 10px;
		padding:10px 0 0 10px;
		background-color:#ffffff;
		z-index:10;
		line-height:1.3;
		border:1px solid #ede8f1;
		border-right:0;
		border-bottom:0;
	}


	.relPosts .posts dd p {
		margin:5px 0 0 0;
		font-size:14px;
	}

	.relPosts .posts dd h3 {
		font-family:"Cormorant Garamond";
		font-size:14px;
		font-weight:400;
	}

	.relPosts .posts dd h3 strong {
		font-size:16px;
		font-weight:400;
	}

	.relPosts .posts li {
	}



	/** Responsive for tablet -------------------------------------------------- **/

	@media all and (max-width: 1024px) and (min-width: 768px) {

		.relPosts .posts li {
			width:24%;
			margin:10px 0.5% 0;
			padding:0;
			box-sizing:border-box;
		}
	}





	/** Responsive for Smart Phone --------------------------------------------- **/

	@media all and (max-width: 767px) {



		.relPosts {
			width:auto;
			max-width:none;
			margin:60px 40px 0;
		}

	.relPosts > header::before {
        display: none;
	}
        
		.relPosts .posts {
			margin:20px 0 0 0;
		}

		.relPosts .posts ul {
			border-top:1px dotted #aaa;
		}

		.relPosts .posts li {
			width:auto;
			margin:0;
			padding:5px 0;
			border-bottom:1px dotted #aaa;
		}

		.relPosts .posts dl {
			display:flex;
			flex-direction:row;
			flex-wrap:nowrap;
			align-items:center;
			margin:0;
			padding:0;
		}

		.relPosts .posts dt {
			width:30%;
			margin:0;
			padding:0;
			box-sizing:border-box;
		}

		.relPosts .posts dd {
			width:70%;
			margin:0;
			padding:0 0 0 20px;
			box-sizing:border-box;
			border-left:0;
			border-top:0;
		}

	}



/** ================================================================================================


	Credit


==================================================================================================== **/




	#sbCredit {
		display:block;
		position:relative;
		width:calc( 100% - 100px );
		max-width:1200px;
		margin:100px auto 0;
		padding:0;

		color:#888888;
		font-size:10px;
		font-weight:400;
		line-height:1.3;
	}
	#sbCredit::after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

	#sbCredit ul {
		float:right;
		margin:0;
		padding:0;
	}

	#sbCredit li {
		position:relative;
		margin:2px 0;
		padding:0 0 0 1em;
		white-space:nowrap;
	}

	#sbCredit li.hearst {
		margin:10px 0 0 0;
	}

	#sbCredit li.hearst img {
		width:150px;
		padding-left:0.5em;
		vertical-align:baseline;
	}



	/** Responsive for Smart Phone ------------------------- **/

	@media all and (max-width: 767px) {


		#sbCredit {
			width:auto;
			max-width:none;
			margin:40px 20px 0;
		}

		#sbCredit ul {
			float:none;
		}

		#sbCredit li {
			padding:0;
            white-space: inherit;
			text-align:center;
		}

		#sbCredit li.hearst {
			margin:10px 0 0 0;
		}

	}





/** ================================================================================================


	Common Parts : ArrowLink


==================================================================================================== **/



	.arrowLink {
		display:block;
		position:relative;
		margin:0;
		padding:0;

		text-align:left;
		letter-spacing:-1em;
	}

	.arrowLink > a {
		display:inline-block;
		vertical-align:middle;
		letter-spacing:normal;
		text-align:center;

		position:relative;
		margin:0 0 10px;
		padding:0 10px 5px 0;
		border-bottom:1px solid #d4c0da;
		text-decoration:none;
	}

	.arrowLink > a::before {
		content:"";
		display:block;
		position:absolute;
		bottom:-1px;
		left:0;
		width:1px;
		height:1px;
		margin:0;
		padding:0;
		background-color:#662f76;
		opacity:0;
		transition:all 0.3s ease-in-out;
	}
	.arrowLink > a::after {
		content:"";
		display:block;
		position:absolute;
		bottom:-5.5px;
		right:0;
		width:8px;
		height:8px;
		margin:0;
		padding:0;
		border:1px solid #d4c0da;
		border-left-color:transparent;
		border-bottom-color:transparent;
		transform:rotate(45deg);
		transition:all 0.3s ease-in-out;
	}



	.arrowLink > a:link,
	.arrowLink > a:visited,
	.arrowLink > a:hover,
	.arrowLink > a:active {
		color:#231815;
	}

	.arrowLink > a:hover::before {
		width:calc( 100% + 10px );
		opacity:1;
		transition:all 0.3s ease-in-out;
	}

	.arrowLink > a:hover::after {
		right:-10px;
		border-color:#662f76;
		border-left-color:transparent;
		border-bottom-color:transparent;
	}




/** ================================================================================================


	Common Parts :BoxLink


==================================================================================================== **/



	.boxLink {
		display:block;
		position:relative;
		margin:0;
		padding:0;

		text-align:center;
		letter-spacing:-1em;
	}

	.boxLink > a {
		display:inline-block;
		vertical-align:middle;
		letter-spacing:normal;
		text-align:center;

		position:relative;
		margin:0 0 25px;
		padding:10px 25px;
		text-decoration:none;
	}

	.boxLink > a::before,
	.boxLink > a::after {
		content:"";
		display:block;
		position:absolute;
		top:0;
		width:10px;
		height:100%;
		margin:0;
		padding:0;
		border:1px solid #000000;
		transition:all 0.6s ease-in-out;
	}
	.boxLink > a::before {
		left:0;
		border-right:0;
	}
	.boxLink > a::after {
		right:0;
		border-left:0;
	}


	.boxLink > a:link,
	.boxLink > a:visited,
	.boxLink > a:hover,
	.boxLink > a:active {
		color:#231815;
	}

	.boxLink > a:hover::before,
	.boxLink > a:hover::after {
		width:50%;
	}



/** ================================================================================================


	Common Parts : Item Link Button


==================================================================================================== **/



	.itemLink {
		text-align:center;
	}


	.itemLink > a {
		display:inline-block;
		vertical-align:middle;
		letter-spacing:normal;

		position:relative;
		margin:0;
		padding:10px 20px;
		line-height:1.5;
		text-decoration:none;
		text-align:center;
	}

	.itemLink > a:link,
	.itemLink > a:visited,
	.itemLink > a:hover,
	.itemLink > a:active { color:#231815; }


	.itemLink > a::before,
	.itemLink > a::after {
		content:"";
		display:block;
		position:absolute;
		top:0;
		width:8px;
		height:100%;
		margin:0;
		padding:0;
		border:1px solid #000000;
		transition:all 0.3s ease-in-out;
	}

	.itemLink > a::before  { left:5px; border-right:0; }
	.itemLink > a::after   { right:5px; border-left:0; }

	.itemLink > a:hover::before  { left:0; }
	.itemLink > a:hover::after   { right:0; }



/** ================================================================================================


	Ã£â€šÂ¢Ã£Æ’Â¼Ã£â€šÂ«Ã£â€šÂ¤Ã£Æ’â€“


==================================================================================================== **/



	.sbArchive {
		display:block;
		position:relative;
		margin:0;
		padding:0;
		box-sizing:border-box;
	}

	.sbArchive > header {
	}

	.sbArchive > header h2 {
		margin:0;
		padding:0;
	}

	.sbArchive > header h2 img {
		width:100%;
		vertical-align:bottom;
	}

	.sbArchive > header h1 {
		margin:20px 35% 0;
		padding:0;
		text-align:center;
	}

	.sbArchive .pages {
		margin:10px 0 0 0;
	}

	.sbArchive .pages ul {
		border-top:1px dotted #aaa;
	}

	.sbArchive .pages li {
		padding:5px 0;
		border-bottom:1px dotted #aaa;
	}

	.sbArchive .pages dl {
		display:flex;
		flex-direction:row;
		flex-wrap:nowrap;
		align-items:center;
		margin:0;
		padding:0;
	}

	.sbArchive .pages dt {
		width:30%;
		margin:0;
		padding:0;
		box-sizing:border-box;
	}

	.sbArchive .pages dt img {
		width:100%;
		vertical-align:bottom;
	}

	.sbArchive .pages dd {
		width:70%;
		margin:0;
		padding:0 0 0 20px;
		box-sizing:border-box;
	}

	.sbArchive .pages h3 {
		display:none;
	}



/** ================================================================================================


	Responsive for tablet


==================================================================================================== **/



	@media all and (max-width: 1024px) and (min-width:768px) {



	/** Star Brides Section Common ============================================= **/

		.sbSection {
			width:calc( 100% - 60px );
			max-width:none;
		}



	/** Star brides ASide Common =============================================== **/

		.sbAside {
			width:calc( 100% - 60px );
			max-width:none;
		}



	}



/** ================================================================================================


	Responsive for Smart Phone


==================================================================================================== **/



	@media all and (max-width: 767px) {





	/** Star Brides Article Common ============================================= **/

		.sbArticle {
			font-size:14px;
			margin-top: 58px;
		}



		/* Header ---------------------------------------------- */

		.sbArticle > header {
			display:block;
		}

		.sbArticle > header .image {
			margin:0;
			width:auto;
		}

		.sbArticle > header .text {
			width:auto;
			padding:40px;
		}

		.sbArticle > header h1 {
			font-size:24px;
		}

		.sbArticle > header h1 strong {
			font-size:28px;
		}

		.sbArticle > header h2 {
			font-size:18px;
			line-height:1.4;
		}

		.sbArticle .lead {
			margin:50px 0 0;
			padding:0;
			font-size:14px;
			font-weight:300;
			line-height:1.8;
		}



		/* Credit ---------------------------------------------- */

/*
		.sbArticle .credit ul {
			float:none;
		}

		.sbArticle .credit li {
			padding:0;
            white-space: inherit;
			text-align:center;
		}

		.sbArticle .credit li.hearst {
			margin:10px 0 0 0;
		}
*/


		/* footer ------------------------------------------ */

		.sbArticle > footer {
			width:auto;
			max-width:none;
			margin:100px 40px 0;
		}





	/** Star Brides Section Common ============================================= **/

		.sbSection {
			width:auto;
			max-width:none;
			margin:80px 0 0;
		}

		.sbSection > header h1 {
			font-size:16px;
			font-weight:400;
		}




/** ============================================================================


	Star brides ASide Common


================================================================================= **/



	.sbAside {
		display:block;
		position:relative;
		width:calc( 100% - 100px );
		max-width:1200px;
		margin:150px auto 0;
		padding:0;
		box-sizing:border-box;

		font-family:'Noto Sans JP', 'Yu Gothic Medium', 'Hiragino Kaku Gothic Pro', Meiryo, sans-serif;
		font-size:14px;
		font-weight:400;
		line-height:1.8;
		color:#958350;
		background-color:#ff0000;
	}
	.sbAside::after { content:"."; display:block; height:0; clear:both; visibility:hidden; }









	/** Common Parts : ArrowLink =============================================== **/



	/** Common Parts :BoxLink ================================================== **/

		.boxLink {
			margin:40px 10px 0;
		}

		.boxLink > a {
			display:block;
			margin:0 0 10px;
		}




	/** Ã£â€šÂ¢Ã£Æ’Â¼Ã£â€šÂ«Ã£â€šÂ¤Ã£Æ’â€“ ============================================================= **/

		.sbArchive {
			width:auto;
			margin:0;
			padding:0;
		}

		.sbArchive > header h1 {
			margin:20px 35% 0;
		}

		.sbArchive .pages {
			margin:10px 20px 0;
		}



	}



















/** ================================================================================================


	Ã£Æ’â€“Ã£Æ’Â©Ã£â€šÂ¤Ã£Æ’â‚¬Ã£Æ’Â«Ã£Æ’â€¢Ã£Æ’Æ’Ã£â€šÂ¿Ã£Æ’Â¼    .sjBridalFooter


==================================================================================================== **/



	.sjBridalFooter {
		display:none;
	}



	/* for Smart Phone ------------------------------------ */

	@media (max-width: 768px) {

		.sjBridalFooter {
			display:block;
			position:relative;
			margin: 30px 0 50px 0;
			padding: 20px 10px;
			background-color:#f2f2f2;
			text-align:center;
			flex-direction: column;
		}


		.sjBridalFooter img {
			width: auto !important;
			max-width: 150px !important;
			height: auto !important;
			vertical-align: bottom;
			margin: 0 auto;
		}

	}

.breadcrumbs {
	width: 85%;
	font-family: 'Poppins', 'Noto Sans JP', sans-serif !important;
	color: #3c3c3c;
	font-size: 1.6rem;
	letter-spacing: 2px;
	text-align: left;
	margin: 10% auto 0px auto;
	display: flex;
	max-width: 1400px;
}

@media (max-width: 768px) {
    .breadcrumbs {
		max-width:none;
		margin: 60px 30px 0px 30px;
		flex-flow: wrap;
		padding: 0 15px;
		}
}

.breadcrumbs a {
    border-bottom: solid 1px rgba(0, 0, 0, 0);
    display: inline-block;
}

.breadcrumbs a:hover {
    opacity: 0.7;
    border-bottom: solid 1px;
    display: inline-block;
}

.breadcrumbs li {
    font-size: 1.2rem;
    line-height: 20px;
}

.breadcrumbs li::after {
    content: '>';
    padding: 0 5px;
}

.breadcrumbs li:last-child::after {
    content: ' ';
}

.breadcrumbs li:last-child {
    font-weight:300;
}