@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho&display=swap');

html {
	scroll-behavior: smooth;
}
html, body {
	scroll-padding-top: 106px;
}
a {
	text-decoration: none;
}
.inner {
	width: 1000px;
	margin: 0 auto;
}
body {
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	background: url("../img/background.svg") repeat;
	background-size: 200px;
}
header {
	height: 120px;
	background: rgba(255,255,255,0.80);
	display: flex;
	justify-content: center;
	position: relative;
}
#site_logo {
	margin-top: 1rem;
	background: url("../img/logo.svg") no-repeat center center/contain;
	height: 90px;
	width: 87px;
}
#site_logo a {
	display: block;
	height: 90px;
	width: 87px;
}
.sticked_nav {
	display: flex;
	position: sticky;
	top: 0;
	z-index: 100;
}
#global_nav {
	width: 100%;
	height: 80px;
	padding: 1rem 0;
	font-family: 'Shippori Mincho', serif;
	background: rgba(255,255,255,0.80);
	position: relative;
}
#global_nav .active_page {
	border-bottom: 1px dotted rgba(223,63,31,1.00);
}
#nav_logo {
	content: "";
	background: url("../img/nav_logo.svg") no-repeat center center/contain;
	height: 64px;
	width: 98px;
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
	margin: 0.5rem 0 0.5rem 2.5rem;
}
#nav_logo a {
	display: block;
	height: 100%;
	width: 100%;
}
#global_nav ul {
	padding: 0 2rem;
	display: flex;
	justify-content: space-between;
}
#global_nav ul li {
	transition: all .3s;
}
#global_nav ul li:hover {
	opacity: 0.5;
}
#global_nav ul li a {
	color: rgba(223,63,31,1.00);
	text-align: center;
}
#global_nav ul li a span{
	display: block;
	margin: 0 auto;
}
#main_image {
	margin: 2rem auto;
	background: url("../img/main_image.jpeg") no-repeat center center/cover;
	width: 1000px;
	height: 650px;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
#main_image::after {
	content: "宝石から永遠を抜いたのなら。";
	font-family: 'Shippori Mincho', serif;
	font-size: 3rem;
	font-weight: 600;
	color: rgba(204,204,204,1.00);
	margin-left: auto;
}
.content_block {
	padding: 0 1rem;
}
main {
	margin: 3rem 0;
	min-height: 100vh;
}
main section{
	margin-bottom: 8rem;
}
.headline {
	color: rgba(213,92,75,1.00);
	font-family: 'Shippori Mincho', serif;
}
h2.headline {
	margin-bottom: 2rem;
	font-size: 2.5rem;
}
h2.headline .en {
	font-size: 1.5rem;
	margin-left: 1rem;
}
#news_block {
	display: flex;
	justify-content: space-between;
}
.news_area dt {
	padding: 0 1rem 1rem 1rem;
	pointer-events: none;
}
.news_area dt:not(:first-child) {
	padding-top: 1rem;
}
.news_area dd a {
	display: block;
	margin-top: -3.5rem;
	padding: 1rem 0rem 1rem 7rem;
	border-bottom: 1px solid rgba(127,114,114,1.00);
	color: #333;
	background: #FFF;
	text-decoration: none;
}
.news_area dd a:hover {
	background: rgba(255,224,207,0.50);
}
.news_img {
	background: url("../img/news_img_2021_aug.jpg") no-repeat center center/cover;
	width: 250px;
	height: 250px;
	border-radius: 50%;
	margin: 2rem auto 0 4rem;
}
.btn_arrow {
	width: 20%;
	margin: 1rem 1rem 0 auto;
	background: #FFF;
	position: relative;
}
.btn_arrow::after {
	content:"";
	position: absolute;
	bottom:0;
	left: 0;
	width: 100%;
	height: 0;
	border-bottom: 1px solid rgba(127,114,114,1.00);
}
.btn_arrow::before {
	content: "";
	width: 1rem;
	height: 1rem;
	border-top: 1px solid rgba(127,114,114,1.00);
	transform: rotate(45deg);
	position: absolute;
	bottom: -8px;
	left: 87%;
	margin-top: -6px;
}
.btn_readmore {
	color: rgba(223,63,31,1.00);
	text-decoration: none;
	font-family: 'Shippori Mincho', serif;
	padding: 0 1.5rem;
	transition: all .3s;
}
.btn_arrow:hover .btn_readmore {
	opacity: 0.5;
}
#columns_block {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#columns_block::after{
	content:"";
	display: block;
	width:300px;
}
.column_article {
	width: 300px;
	height: 350px;
	margin-bottom: 1.5rem;
	background: #FFF;
	position: relative;
	overflow: hidden;
	opacity: 0.8;
}
.column_article:hover {
	opacity: unset;
}
.column_article:hover .column_caption {
	top: 40%;
}
.column_num {
	position: absolute;
	top: 0;
	left: 0;
	background: rgba(81,181,127,0.80);
	width: 4rem;
	padding: 0.75rem 1rem;
	text-align: center;
	color: #FFF;
	font-weight: bold;
}
.column_num::before {
	content: "vol.\A";
	white-space: pre;
}
.column_caption {
	position: relative;
	top: 100%;
	background: rgba(0,0,0,0.30);
	height: 60%;
	color: #FFF;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.25rem;
	transition: all .3s;
}
.column_title {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.column_vol1 {
	background: url("../img/columns/column_img_001.jpeg") no-repeat center center/cover;
}
.column_vol2 {
	background: url("../img/columns/column_img_002.jpg") no-repeat center center/cover;
}
.column_vol3 {
	background: url("../img/columns/column_img_003.jpg") no-repeat center center/cover;
}
.column_vol4 {
	background: url("../img/columns/column_img_004.jpg") no-repeat center center/cover;
}
.column_vol5 {
	background: url("../img/columns/column_img_005.jpg") no-repeat center center/cover;
}
footer {
	background: rgba(213,92,75,0.60);
	width: 100%;
}
footer section {
	margin-top: 2rem;
}
footer .inner {
	display: flex;
	justify-content: space-around;
}
footer #company_infomation {
	max-width: 250px;
	word-break: keep-all;
	line-break: strict;
	word-wrap: break-word;
	overflow-wrap: break-word;
	color: #FFF;
}
footer #company_infomation {
	display: flex;
	flex-wrap: wrap;
	align-self: center;
}
footer #company_infomation * {
	padding-bottom: 0.75rem;
}
footer #company_infomation .company_name {
	font-size: 1.25rem;
}
footer #company_infomation .company_address,.company_phonenum {
	padding-left: 1rem;
}
footer #company_infomation .company_name {
	color: rgba(223,63,31,1.00);
}
footer #company_infomation .company_phonenum::before {
	content: "TEL：";
}
footer #site_map .ft_nav {
	font-family: 'Shippori Mincho', serif;
	display: flex;
	justify-content: space-around;
	max-width: 750px;
}
footer #site_map .ft_nav h3 {
	color: rgba(223,63,31,1.00);
	font-weight: 600;
	font-size: 1.25rem;
	padding-bottom: .25rem;
	margin-bottom: .5rem;
	border-bottom: 1px dotted;
}
footer #site_map .ft_nav > li {
	min-width: 6rem;
}
footer #site_map .ft_nav > li:not(:last-child) {
	margin-right: 1.5rem;
}
footer #site_map .ft_nav > li a {
	color: #FFF;
}
footer #contact_windows .icon_list {
	display: flex;
	justify-content: center;
}
footer #contact_windows .icon_list li:not(:last-child) {
	margin-right: 2rem;
}
footer #contact_windows .icon_list .mail_icon {
	width: 24px;
	background: url("../img/contact/mail.png") no-repeat center center/contain;
}
footer #contact_windows .icon_list .twitter_icon {
	width: 24px;
	background: url("../img/contact/twitter.png") no-repeat center center/contain;
}
footer #contact_windows .icon_list .instagram_icon {
	width: 24px;
	background: url("../img/contact/instagram.png") no-repeat center center/contain;
}
footer #addendum {
	color: #FFF;
	text-align: center;
	padding-bottom: 1rem;
}
footer #addendum small {
	display: block;
}

/*下層ページ用CSS*/
#lowerpage_header {
	height: 80px;
	background: transparent;
	margin-bottom: 2rem;
}
#lowerpage_title {
	background: url("../img/main_image.jpeg")no-repeat center center/cover;
	padding: 1rem 0;
}
#lowerpage_title h2 {
	font-family: 'Shippori Mincho', serif;
	text-align: center;
	background: rgba(255,255,255,0.80);
}
#lowerpage_title span {
	display: block;
}
#lowerpage_title span.ja {
	font-size: 2rem;
	color: rgba(136,136,136,1.00);
	letter-spacing: 0.5rem;
}
#lowerpage_title span.en {
	font-size: 1rem;
	color: rgba(213,92,75,1.00);
	padding-bottom: 0.25rem;
}
h3.headline {
	margin: 0 0 2rem 0;
	text-align: center;
}
h3.headline span {
	display: block;
}
h3.headline .ja {
	font-size: 2rem;
	margin: 0;
}
h3.headline .en {
	font-size: 1.5rem;
	margin: 0;
}

/*製品紹介*/
.product_type_caption {
	font-family: 'Shippori Mincho', serif;
	margin-left: 2rem;
}
.products_list {
	margin-left: 2rem;
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
}
.product {
	margin: 1rem 1rem 0;
	width: 150px;
	height: 350px;
	cursor: pointer;
}
.product:hover {
	opacity: 0.8;
}
.product img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.product img.l_t {
	object-position: left top;
}
.product img.l_c {
	object-position: left center;
}
.product img.l_b {
	object-position: left bottom;
}
.product img.r_t {
	object-position: right top;
}
.product img.r_c {
	object-position: right center;
}
.product img.r_b {
	object-position: right bottom;
}
/*製品紹介ウィンドウ*/
.product_detail {
	min-height: 80vh;
	display: flex;
	padding: 1rem 2rem;
}
.product_detail .product_img {
	width: 450px;
	height: 100%;
	margin-right: 2rem;
}
.product_detail .product_img img {
	object-fit: cover;
}
.product_detail .product_detail_caption {
	width: 500px;
	height: 100%;
	margin-top: 2rem;
}
.product_caution {
	margin-top: 1rem;
}
.product_caution small {
	display: block;
	padding-bottom: 0.25rem;
}
.btn_onlineshop {
	position: absolute;
	right: 15%;
	bottom: 30%;
}
.btn_onlineshop a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 auto;
	padding: 0.5rem 2rem;
	width: 250px;
	color: #FFF;
	font-size: 1rem;
	font-weight: 400;
	background: rgba(213,92,75,1.00);
	border-radius: 50vh;
}
.btn_onlineshop a::after {
	content: "";
	width: 8px;
	height: 8px;
	border-top: 3px solid #FFF;
	border-right: 3px solid #FFF;
	transform: rotate(45deg);
}
.btn_onlineshop a:hover {
	text-decoration: none;
	opacity: 0.8;
}

/*コンセプト*/
.concept {
	width: 800px;
	margin: 2rem auto 5rem;
	font-family: 'Shippori Mincho', serif;
}
.concept .headline {
	text-align: center;
	font-size: 1.75rem;
}
.concept .headline span {
	display: block;
}
.concept .headline .concept_sub {
	font-size: 1.25rem;
}
.concept .headline .concept_sub::before,
.concept_sub::after {
	content: "−";
}
.concept p {
	line-height: 1.75rem;
}
.concept dl {
	margin: 1rem;
}
.concept dl dd {
	margin: 0 0 0.75rem 0.75rem;
}
/*会社情報*/
#company table {
	margin: 0 auto;
	width: 700px;
	background: #FFF;
	vertical-align: middle;
	border-collapse: collapse;
}
#company tr {
	padding: 1.5rem 0;
}
#company td {
	border-bottom: 1px solid #ccc;
	padding: 1rem 2rem;
}
#company table td:nth-child(1) {
	width: 13rem;
	text-align: center;
}
/*販売店*/
.store_information {
	display: flex;
}
.store_information iframe {
	width: 450px;
	height: 350px;
	border: none;
}
.store_information .store_about {
	margin-left: 2rem;
	width: 500px;
	padding-top: 1rem;
}
.store_information .store_about ul li{
	margin: 0.5rem 0;
}
.store_information .store_about ul li.popupstore_name{
	font-weight: bold;
}
/*採用情報*/
#newgrad,#career p {
	text-align: center;
}
/*お問合せフォーム*/

#contact #form_wrap {
	max-width: 960px;
	margin: 0 auto;
}
#contact .fld,#contact #pref {
	border: 1px solid #CCC;
	padding: .5rem;
	border-radius: .25rem;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.1) inset;
	background: #FFF;
}
#contact #pref {
	padding: .75rem 2rem .75rem .5rem;
	display: block;
	margin-bottom: .5rem;
}
#contact .address_box {
	position: relative;
}
#contact .txt_fld,
#contact textarea {
	width: 25rem;
}
#contact textarea {
	min-height: 8rem;
	resize: vertical;
}
#contact .zip_fld {
	width: 4rem;
}
#contact .hyphen {
	margin: 0 .5rem;
}
#contact dt {
	padding: 1.5rem 1rem;
	min-height: 4rem;
}
#contact dd {
	margin: calc(-4rem - 2px) 0 0 0;
	padding: 1rem 0 1rem 15rem;
	border-bottom: 1px dotted #dedede;
	min-height: 4rem;
}
#contact dd {
	margin: -4.5rem 0 0 0;
	padding: 1.5rem 0 1.5rem 15rem;
}
#contact dd:hover {
	background: rgba(255,224,207,0.50);
}
#contact .required {
	color: #F00;
}
#contact input:focus,
#contact textarea:focus {
	background: rgba(255,248,220,1.00);
	outline: none;
}
#contact input[type="radio"]:not(:first-of-type),
#contact input[type="checkbox"]:not(:first-of-type) {
	margin-left: 1rem;
}
#contact .radio_box,.check_box {
	padding: 1.5rem 0 1.5rem 15rem;
}
#contact label.error {
	color: #F00;
	font-size: 0.875rem;
	margin-left: 1rem;
}
#contact input.error,
#contact textarea.error {
	background: #FCC;
}
#contact .check_block {
	display: none;
}
#contact .check_block.on_block {
	display: block;
}
#contact #submit[disabled] {
background: #CCC;
}
#contact .ck_wrap {
	margin: 1rem auto;
	border: 1px solid #ccc;
	padding: 1rem;
	max-width: 500px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: rgba(255,255,255,0.70);
}
#contact .ck_wrap input {
	margin-right: .5rem;
}
#contact .btn_block {
	width: 1000px;
	margin: 1rem auto;
	display: flex;
	justify-content: center;
}
#contact .btn, #submit {
	margin: 0;
}
#contact btn:first-child {
	margin-right: 1rem;
}
#contact .btn {
	width: 300px;
	text-align: center;
	padding: .5rem;
	border-radius: 2rem;
	background: rgba(213,92,75,1.00);
	color: #FFF;
	margin: 0 auto;
	display: block;
	border: none;
}
#contact .btn:hover {
	opacity: .6;
}
#contact #submit {
	margin: 3rem auto;
}
/*最新情報*/
#article_list {
	font-family: 'Shippori Mincho', serif;
	min-height: 100vh;
	background: #FFF;
	padding: 2rem;
}
#news_sidemenu {
	background: #CCC;
	padding: 1rem 0;
}
.sortmenu {
	display: flex;
}
.sortmenu li {
	margin-left: 2rem;
}
.pulldown {
	padding: 0.25rem;
}
.article_thumbnail {
	display: flex;
	flex-wrap: wrap;
	padding: 1rem 0;
	border-bottom: 1px solid #CCC;
}
.article_thumbnail:last-child {
	border-bottom: none;
}
.article_link {
	width: 100%;
	display: block;
	margin: 1rem 0 1rem 1rem;
}
.article_link a {
	color:rgba(75,75,75,1.00);
}
.article_link:hover {
	opacity: 0.7;
}
.article_category {
	margin-left: 1rem;
}
.category_notice::after {
	content: "お知らせ";
	color: #FFF;
	border: 1px solid rgba(164,40,42,1.00);
	background: rgba(209,82,84,1.00);
	padding: 0 0.5rem;
}
.category_columns::after {
	content: "コラム";
	color: #FFF;
	border: 1px solid rgba(17,71,46,1.00);
	background: rgba(31,119,83,1.00);
	padding: 0 0.5rem;
}
.article_link .article_title {
	font-size: 1.75rem;
	margin-bottom: 0.5rem;
}
/*記事本文*/
.article_detail {
	font-family: 'Shippori Mincho', serif;
	width: 800px;
	min-height: 100vh;
	background: #FFF;
	padding: 1rem 2rem;
}
.article_header {
	display: flex;
	flex-wrap: wrap;
}
.article_header h2 {
	font-size: 2rem;
	width: 100%;
	margin-top: 1rem;
}
.article_text {
	margin-top: 0.5rem;
}
.article_text img {
	width: 50%;
	margin: 1rem auto;
}
.article_footer {
	margin-top: 1.25rem;
	height: 1.5rem;
	text-align: center;
	font-size: 1.25rem;
}
.article_footer a {
	color: rgba(75,75,75,1.00);
}
.article_footer a::before {
	content: "《";
}
.article_footer a::after {
	content: "》";
}
.article_footer a:hover {
	opacity: 0.7;
}

/*アニメーション等*/
.circle_img {
	margin: 2rem auto 0;
}
.circle_img img {
	margin: 1rem auto;
	width: 150px;
	height: 150px;
	object-fit: cover;
	border-radius: 50%;
}