@charset "utf-8";



.pc {

  display: none;

}

.sp {

  display: block;

}

.pcBr {

  display: none;

}

.spBr {

  display: inline;

}



#container {

	margin: 0 auto;

	min-width: 1200px;

}

@media screen and (max-width: 640px) {

	#container {

		margin: 0 auto;

		width: 100%;

        min-width: initial;

	}

}





@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);



/* header */

#header{

	font-family: "Arial", 'Noto Sans JP', sans-serif;

	font-size: 1.15em;

	color: #090909 !important;

	line-height: 1.85;

	letter-spacing: 0.06rem;

    margin: 0;

    padding: 20px 0 0 0;

    position: fixed;

    min-width: 1200px;

    width: 100%;

    height: 92px;

    z-index: 999;

    background-color: #fff;

    border-bottom: 1px solid #dadada;

}

@media screen and (max-width: 640px) {

	#header{

    	font-size: 1.2em;

		margin: -27px 0 0 0;

		padding: 0;

		height: 64px;

		min-width: initial;

		display: flex;

		align-items: center;

	}

}

.header_area{

	position: relative;

	margin: 0 auto;

    /*width: 1200px;*/

    width: 100%;

    min-width: 1200px;

}

@media screen and (max-width: 640px) {

	.header_area{

		position: relative;

		margin: 0 auto;

		width: 90%;

        min-width: auto;

	}

}

.header_area_sub{

	width: 1200px; margin: 0 auto; position: relative;

    /*border: 1px solid #ff0000;*/

}

@media screen and (max-width: 640px) {

	.header_area_sub{

		width: 100%;

	}

}



#header.UpMove{

	position: fixed;

	width:100%;

	animation: UpAnime 0.5s forwards;

}

@keyframes UpAnime{

	from {

		opacity: 1;

		transform: translateY(0);

	}

	to {

		opacity: 0;

		transform: translateY(-100px);

	}

}

#header.DownMove{

	position: fixed;

	width:100%;

	animation: DownAnime 0.5s forwards;

}

@keyframes DownAnime{

	from {

		opacity: 0;

		transform: translateY(-100px);

	}

	to {

		opacity: 1;

		transform: translateY(0);

	}

}



.global-nav {

	margin: 0 auto;

	/*width: 600px;*/

	position: relative;

	z-index: 1;

}

.global-nav .nav-list {

	display: flex;

	justify-content: center;

	list-style: none;

	/*margin: 0 50px 0 0;*/

    margin: 0;

	padding: 0 50px 0 0;

}

.global-nav .nav-list .nav-item {

	/*flex: 1;*/

	/*width: 100%;*/

	/*height: 70px;*/

	padding: 0 1.4em 1.4em 1.4em;

}

.global-nav .nav-list .nav-item a {

	/*border-right: 1px solid #ccc;*/

	color: #090909;

	display: block;

	padding: 0.6em 0.4em;

	text-align: center;

	text-decoration: none;

	transition:0.5s;

}

.global-nav .nav-list .nav-item a:hover {

	color: #aaaaaa;

}





/* spボタン */

.global-nav-icon {

	display: none;

}

@media screen and (max-width: 640px) {

	.global-nav-header {

	}

	.global-nav .nav-list {

		background: rgba(255, 255, 255, 0.9);

		display: none;

		left: 50%;

		padding: 10px 10px 10px 10px;

		position: absolute;

		transform: translate(-50%, 0%);

		width: 100%;

	}

	.global-nav .nav-list .nav-item:first-child {

		padding: 0.6em 2em 0 2em;

	}

	.global-nav .nav-list .nav-item {

		padding: 0 2em;

	}

	.global-nav .nav-list .nav-item a {

    	font-family: "Arial", 'Noto Sans JP', sans-serif;

		border-bottom: 1px solid #090909;

		color: #090909;

        padding: 0.715rem 0.75rem;

		text-align: left;

	}

	.global-nav-icon {

		cursor: pointer;

		display: inline-block;

		position: absolute;

		left: 0;

		top: -20px;

		z-index: 2;

		width: 50px;

		height:50px;

	}

	/*ボタン内側*/

	.global-nav-icon span{

		display: inline-block;

		transition: all 0.5s;/*アニメーションの設定*/

		position: absolute;

		left: 10px;

		height: 2px;

		border-radius: 2px;

		background: #090909;

		width: 45%;

	}

	.global-nav-icon span:nth-of-type(1) {

		top:10px; 

	}

	.global-nav-icon span:nth-of-type(2) {

		top:18px;

	}

	.global-nav-icon span:nth-of-type(3) {

		top:26px;

	}

	/*activeクラスが付与されると線が回転して×に*/

	.global-nav-icon.active span:nth-of-type(1) {

		top:10px;

		left: 10px;

		transform: translateY(8px) rotate(-45deg);

		width: 40%;

	}

	.global-nav-icon.active span:nth-of-type(2) {

		opacity: 0;/*真ん中の線は透過*/

	}

	.global-nav-icon.active span:nth-of-type(3){

		top: 26px;

		left: 10px;

		transform: translateY(-8px) rotate(45deg);

		width: 40%;

	}

}









/* サブナビ */

@media screen and (min-width: 641px) {



	.nav-list {

		position: relative;

	}

	.nav-item_sub {

		background: #fff;

		left: 0;

        /*right: -18px;

		margin: 0 calc(50% - 50vw);*/

		opacity: 0;

		position: absolute;

		top: 70px;

		transition: all 0.5s ease;

		/*visibility: hidden;*/

		display: none;

		width: 100%;

		box-shadow: 0 2px 10px #dadada;

	}

	.nav-item_sub .nav-inner {

		display: flex;

		justify-content: center;

		margin: 0 auto;

		width: 1200px;

	}

	.nav-item_sub .nav-inner ul {

		margin: 20px 20px 20px;

	}

	.global-nav .nav-list .nav-item_sub a {

		text-align: left;

	}

	.nav-item:hover .nav-item_sub {

		opacity: 1;

		/*visibility: visible;*/

		display: block;

		animation: appear 0.5s ease;

	}

	@keyframes appear {

		0% {

			opacity: 0;

		}

		100% {

			opacity: 1;

		}

	}

}



@media screen and (max-width: 640px) {

	.nav-item_sub {

		display: none;

	}

	.global-nav {

		height: 100%;

		left: 0;

		position: fixed;

		top: 64px;

		width: 100%;

		z-index: 1;

	}

	.nav-list {

		height: 100%;

		overflow: auto;

		-webkit-overflow-scrolling: touch;

	}

}



/* ヘッダー */

.logo_orientstar{

	position: absolute;

	z-index: 10;

}

.logo_orientstar img{

	position: absolute; 

	top:4px; 

	left:5px; 

	height:40px;

    max-width: initial;

}

.logo_cart{

	position: absolute;

	top:0; 

	right:0;

	z-index: 10;

	/*font-size: 1.6rem;*/

	font-weight: normal;

}

.logo_cart img{

    position: absolute;

    top: 3px;

    right: 0;

    z-index: 10;

    width: 40px;

    float: right;

    max-width: initial;

}

.logo_cart span{

    position: absolute;

    top: 10px;

    right: 40px;

    z-index: 10;

    width: 175px;

    letter-spacing: 0.06rem !important;

}

@media screen and (max-width: 640px) {

	.logo_orientstar{

		position: absolute; 

		top:-25px; 

		left:50%;

		margin-left: -55px;

		width:110px;

	}

	.logo_cart{

		position: absolute;

		top:-10px; 

		right:0;

		z-index: 10;

	}

	.logo_cart img{

		margin-top: -10px;

		width: 35px;

	}

	.logo_cart span{

		display: none;

	}

}



.menu_ds-f{

	display: flex;

	flex-wrap: wrap;

	justify-content: center;

}

.menu_ds-f p{

	text-align: center;

}

.menu_sub_1{

	width:176px;

}

.menu_sub_2{

	width:330px;

	height: 150px;

	object-fit: cover;

}

.menu_sub_3{

	width:106px;

	height: 100px;

	margin: 0 20px;

	object-fit: cover;

	object-position: 93% 50%;

}

.menu_sub_4{

	text-align: center !important;

	border: 1px solid #d9d9d9;

}

.menu_sub_4 img{

	width:320px;

	margin-bottom: 5px;

}

.menu_sub_5{

	text-align: center !important;

	border: 1px solid #d9d9d9;

}

.menu_sub_5 img{

	width:100%;

}

.menu_sub_6{

}

.menu_sub_6 img{

	  width: 25100%x;

  height: 150px;

  object-fit: cover;

}



@media screen and (max-width: 640px) {

	.menu_ds-f{

		display: block;

	}

	.menu_ds-f p{

        text-align: left;

        margin-left: 1.5rem;

        /*font-size: 0.75em;*/

        line-height: 1.7em;

	}

	.menu_ds-f p.fs075{

        font-size: 0.74em;

	}

	.menu_sub_1{

		display: none;

	}

	.menu_sub_2{

		display: none;

	}

	.menu_sub_3{

		display: none;

	}

	.menu_sub_4{

		font-size: 1.2rem;

		border: none;

	}

	.menu_sub_4 img{

		width:80%;

	}

	.menu_sub_5{

		font-size: 1.2rem;

		border: none;

	}

}





/* フッター */

#footer{

	font-family: "Arial", 'Noto Sans JP', sans-serif;

	font-size: 1em;

	color: #090909 !important;

	line-height: 1.85;

	letter-spacing: 0.07rem;

	margin: 100px 0 0 0;

	padding: 53px 0 0 0;

	position: relative;

	background-color: #f8f8f8;

    text-align: left;

    min-width: 1200px;

    width: 100%;

}

@media screen and (max-width: 640px) {

    #footer{

        font-size: 1.15em;

		margin: 50px 0 0 0;

		padding: 50px 0 0 0;

		position: relative;

		background-color: #f8f8f8;

        min-width: initial;

    }

}

.footer_area{

	margin: 0 auto;

	width: 1200px;

}

@media screen and (max-width: 640px) {

	.footer_area{

		margin: 0 5%;

		width: 90%;

	}

}

.footer_notes{

	padding-left:1em !important;

	text-indent:-1em !important;

	margin-top: 20px;

	font-size: 0.75rem !important;

}

@media screen and (max-width: 640px) {

    .footer_notes{

        font-size: 0.88rem !important;

		margin-top: 10px;

    }

}

p.footer_notes{

    line-height: 1.7em;

    padding-top: 0em;

    padding-bottom: 0em;

}

.logo_sns{

	width: 3%;

}

@media screen and (max-width: 640px) {

	.logo_sns{

		width: 12%;

	}

}

.logo_sns img{

	width: 100%;

}

a .logo_sns_facebook:hover{

	fill: #3b5998;

}

a .logo_sns_instagram:hover{

	fill: #d83776;

}

a .logo_sns_youtube:hover{

	fill: #ff0000;

}

.ac_footer {

	float: left;

	width: 16.5%;

	/*border: 1px solid #090909;*/

}

.ac_footer-label{

	font-weight: bold;

}

.ac_footer-content {

    font-size: 0.85em;

    padding: 0 0 8px 0;

}

.ac_footer-content p{

    font-family: "Arial", 'Noto Sans JP', sans-serif;

    line-height: 1.7em;

    padding-top: 0em;

    padding-bottom: 0em;

}

@media screen and (max-width: 640px) {

	.ac_footer {

		width: 100%;

		margin: 0 auto;

	}

	.ac_footer > li {

		padding-bottom: 6px;

		list-style: none;

	}

	.ac_footer-label{

		cursor: pointer;

		position: relative;

		padding: 0.5em;

		border-bottom: 1px solid #d9d9d9;

	}

	.ac_footer-content {

		display: none;

	}

	.ac_footer-content p{

        padding: 10.4px 0 10.4px 20px;

		border-bottom: 1px solid #d9d9d9;

	}

	.ac_footer-content_block {

        padding: 0.6em 0.5em;

		border-bottom: 1px solid #d9d9d9;

	}

	.icon-wrap {

		position: absolute;

		right: 5px;

		top: 50%;

		transform: translatey(-50%);

		width: 30px;

		height: 30px;

		background: #d3d3d3;

	}

	.icon {

		position: relative;

		display: inline-block;

		width: 100%;

		height: 100%;

	}

	.icon:before,

	.icon:after {

		position: absolute;

		content: "";

		display: block;

		transition: all 0.5s;

		background: #fff;

		left: 50%;

		top: 50%;

		width: 50%;

		height: 2px;

		transform: translate(-50%, -50%);

	}

	.icon:before {

		transform: translate(-50%, -50%) rotate(90deg);

	}

	/*＋、－切り替え*/

	.icon.open:before {

		transform: translate(-50%, -50%) rotate(0deg);

	}

}



#footer .ac_footer-label p{

    font-family: "Arial", 'Noto Sans JP', sans-serif;

    line-height: 1.75em;

    padding-top: 0;

    padding-bottom: 0;

    font-size: 1.15em;

}

@media screen and (max-width: 640px) {

    #footer .ac_footer-label p{

        font-size: 1.2em;

    }

    #footer .ac_footer-label p.fs128{

        font-size: 1.28em;

    }

}

#footer .ac_footer-content_block a,

#footer .ac_footer-label a{

	font-family: "Arial", 'Noto Sans JP', sans-serif;

	color: #090909 !important;

	font-weight: 500;

    font-size: 0.98em;

}

@media screen and (max-width: 640px) {

    #footer .ac_footer-content_block a{

        font-weight: normal;

        font-size: 1.13em;

    }

    #footer .ac_footer-label a{

        font-weight: bold;

        font-size: 1.07em;

    }

}

#footer .ac_footer-content_block p{

    padding-top: 0em;

    padding-bottom: 0em;

    line-height: 1.7em;

    font-size: 1.15em;

}

@media screen and (max-width: 640px) {

    #footer .ac_footer-content p.fs130{

        font-size: 1.3em;

    }

    #footer .ac_footer-content a{

        font-family: "Arial", 'Noto Sans JP', sans-serif;

        color: #090909 !important;

        font-size: 1.32em;

    }

    footer li {

        display: block;

        padding: 0; 

    }

}



.l-footer-bottom-wrap {

	background-color: #212121;

}

.l-footer-bottom {

	width: 1120px;

	margin: 0px auto;

	padding: 10px 0px;

}

.l-footer-bottom-navi {

    padding: 12px 0 7px 0;

	text-align:center;

}

.l-copyright {

    font-family: "Arial", 'Noto Sans JP', sans-serif;

    font-size: 12px;

    line-height: 16px;

    color: #aeaeae;

    text-align: center;

    letter-spacing: 1px;

}

@media screen and (max-width:768px) {

	.l-footer-bottom-wrap {

		background-color: #212121;

	}

	.l-footer-bottom {

		width: auto;

		margin: 0px auto;

        padding: 17px 0 28px 0;

		text-align: center;

	}

	.l-footer-bottom-navi {

		float: none;

		padding-bottom: 28px;

	}

	.l-footer-bottom-navi img {

	width:20%;

	}

	.l-footer-bottom-navi li {

		font-size: 22px;

		line-height: 28px;

		color: #aeaeae;

		float: none;

		display: inline-block;

	}

	.l-footer-bottom-navi li a {

		color: #aeaeae;

	}

	.l-copyright {

        font-family: "Arial", 'Noto Sans JP', sans-serif;

		font-size: 11px;

		line-height: 0;

		color: #aeaeae;

		float: none;

	}

}













/* Page Top */

#footer #page-top a{

    display: flex;

    justify-content: center;

    align-items: center;

    background: #aaa;

    border-radius: 5px;

    width: 60px;

    height: 60px;

    color: #fff;

    text-align: center;

    text-transform: uppercase;

    text-decoration: none;

    font-size: 0.6rem;

    transition: all 0.5s;

}

@media screen and (max-width: 640px) {

	#page-top a{

		font-size:1rem;

	}

}

#page-top a:hover{

	background: #2b2b2b;

}

/*リンクを右下に固定*/

#page-top {

    position: fixed;

    right: 10px;

    bottom: 140px;

    z-index: 99;

    opacity: 0; 

    transform: translateY(100px);

}

#page-top.UpMove{

	animation: page-top_UpAnime 0.5s forwards;

}

@keyframes page-top_UpAnime{

	from {

		opacity: 0;

		transform: translateY(100px);

	}

	to {

		opacity: 1;

		transform: translateY(0);

	}

}

#page-top.DownMove{

    animation: page-top_DownAnime 0.5s forwards;

}

@keyframes page-top_DownAnime{

	from {

		opacity: 1;

		transform: translateY(0);

	}

	to {

		opacity: 1;

		transform: translateY(100px);

	}

}



/* clearfix

---------------------------------------------------------------------------- */

.clearfix:after {

  content: "";

  display: block;

  clear: both;

} 

.clearfix:before {

  content: "";

  display: block;

  clear: both;

} 

.clearfix {

  display: block;

}







/* 追加 */

.spacer {width: 100% !important;}

.bold {font-weight: bold !important;}

.flL {float: left;}

.mr10{margin-right: 10px;}

.ml20{margin-left: 20px;}

.tac{text-align: center;}

p.tac{

    line-height: 1.7em;

    padding-top: 0em;

    padding-bottom: 0em;

    font-size: 1.15em;

}

@media screen and (max-width: 640px) {

    p.tac{

        font-size: 1.05em;

    }

}

.ds-f {

    display: flex !important;

    flex-wrap: wrap !important;

    justify-content: center !important;

    align-items: center !important;

    text-align: center !important;

}

.primary2_04{padding-top: 98px !important;}