@charset "utf-8";@charset "utf-8";
/* Stones */
.stones { padding: 60px 30px 0; }
.stones > .inner { width: 100%; max-width: 1200px; margin: 0 auto; box-sizing: border-box; }
.pageTitle { padding-bottom: 60px; }
.layout_row_wrap { background: #f7f7f7; padding: 0 40px; max-width: 1200px; margin: 0 auto; }
.layout_row_wrap > .inner { max-width: 1040px; margin: 0 auto; }
.layout_row { margin: 0 -20px; padding: 40px 0; overflow: hidden; }
.layout_row::after { content: ''; display: block; clear: both; }
.layout_col { width: 33.33%; padding: 40px 20px; box-sizing: border-box; }
.layout_col_head { padding-bottom: 30px; }
.layout_col_head .thum { display: table; width: 100%; margin-bottom: 20px; }
.layout_col_head .thum > .inner { display: table-cell; vertical-align: middle; text-align: center; height: 100px; }
.stones .text_en { font-family:"Sackers Gothic Medium",sans-serif; font-size: 20px; letter-spacing: .03em; color: #1a1a1a; line-height: 1; text-align: center; margin-bottom: 10px; line-height: 1; font-weight: 400; }
.stones .text_jp { font-size: 14px; letter-spacing: 0.2em; color: #1a1a1a; text-align: center; margin-bottom: 20px; line-height: 1; font-weight: bold; }
.birthstone { font-size: 12px; letter-spacing: 0.2em; color: #1a1a1a; text-align: center; line-height: 1; }
.layout_col_body .ttl4 { font-size: 14px; font-weight: bold; color: #1a1a1a; margin-bottom: 5px; }
.layout_col_body .text { font-size: 14px; color: #1a1a1a; line-height: 1.8; margin-bottom: 30px; }
.layout_col_body .text:last-child { margin-bottom: 0; text-align: justify; }
.stones img { width: auto; height: auto; max-height: 70px; }

@media screen and (max-width:750px) {
	.stones { padding: 60px 0 0; }
	.pageTitle { margin-bottom: 0; padding-bottom: 0; font-size: 350%; }
	.layout_row_wrap { background: #fff; padding: 0; }
	.layout_row { margin: 0; padding: 0; }
	.layout_col:first-child { border-top: 1px solid #E5E5E5; }
	.layout_col { float: none; width: 100%; padding: 0; border-bottom: 1px solid #E5E5E5; }
	.layout_col > .inner { display: block; width: 100%; }
	.layout_col_head { padding: 5px 0; height: 75px; display: table; width: 100%; vertical-align: middle; position: relative; cursor: pointer; }
	.layout_col_head.active { padding:20px 0 0; background: #f7f7f7; }
	.layout_col_head .thum { display: table-cell; vertical-align: middle; text-align: center; width: 95px; height: 75px; margin-bottom: 0; padding-left: 10px; }
	.layout_col_head .thum > .inner { display: inline-block; height: auto; }
	.layout_col_head .text { display: table-cell; vertical-align: middle; padding-right: 50px; }
	.stones .text_en { font-size: 12px; text-align: left; margin-bottom: 8px; }
	.stones .text_jp { font-size: 10px; text-align: left; margin-bottom: 8px; }
	.birthstone { font-size: 10px; text-align: left; margin-bottom: 8px; }
	.layout_col_body { display: none; background: #f7f7f7; padding: 15px 22px 30px; }
	.layout_col_body .ttl4 { font-size: 14px; font-weight: bold; color: #1a1a1a; margin-bottom: 5px; }
	.layout_col_body .text { font-size: 10px; color: #1a1a1a; line-height: 1.8; margin-bottom: 40px; }
	.layout_col_body .text:last-child { margin-bottom: 0; text-align: justify; }
	.layout_col_head { position: relative; }
	.layout_col_head::after { content: ""; display: block; position: absolute; top: 50%; right: 19px; transform: translateY(-50%); -webkit-transform: translateX(-50%); width: 16px; height: 10px; background: url(https://www.artidaoud.com/photo/page/220818_stones/arrow_down.png) no-repeat; background-size: 100% 100%; }
	.layout_col_head.active::after { background-image: url(https://www.artidaoud.com/photo/page/220818_stones/arrow_up.png); }
	.stones img { width: auto; height: auto; max-height: 43px; }
	img.ruby { max-height: 40px; }
	img.roundSt, img.moonstone { max-height: 46px; }
	img.peridot, img.citrine, img.iolite, img.hema { max-height: 47px; }
	img.lapis, img.labrad, img.aquam { max-height: 48px; }
	img.sapphire { max-height: 52px; }
	img.greenQ { max-height: 52px; }
	img.emerald { max-height: 58px; }
}
/**/
	.link2hrsc { margin: 60px 22px 20px 0; font-size: 110%; text-align: right; }
	.link2hrsc::before { content: '>'; display: inline-block; padding-right: .3em; font-size: 110%; }
	.btn2hrsc { margin: 6em auto 0; }
	.btn2hrsc a { display: block; width: 100%; max-width: 300px; margin:0 auto; padding: 1.2em 0; letter-spacing: .05em; text-indent: .05em; text-align: center; border: 1px solid #a6a69f; }
	.btn2hrsc span { display: block; margin-bottom: .2em; font-family: 'Freight Big Light', 'Times New Roman', serif; font-size: 200%; line-height: 1; }

	.viewBtn a { display:block; width:100%;  margin:.2em auto 2em; padding: .9em 0 .8em; font-family:"Sackers Gothic Medium",sans-serif; font-size:10px; letter-spacing:.03em;text-indent:.03em; line-height:1; text-align:center; border:1px solid #777; transition:.3s; cursor:pointer;  }
	.viewBtn a::before { content:'VIEW ITEMS'; }

@media screen and (min-width:751px) {
	.layout_row { display: flex; flex-wrap: wrap;}
	.link2hrsc { margin: 3em .5em 2em 0; font-size: 140%; }
	img.peridot, img.citrine { max-height: 76px; }
	img.roundSt, img.lapis, img.labrad, img.aquam, img.iolite, img.hema { max-height: 77px; }
	img.greenQ { max-height: 81px; }
	img.sapphire { max-height: 90px; }
	img.emerald { max-height: 103px; }
	.viewBtn a { max-width: 320px; font-size:11px; }
}