/* p-detailtop-watch
─────────────────────────────────────────────────────────────────────────────────── */


/* product-conts(スライドイメージ　スペック)
─────────────────────────────────────────────────────────────────────────────────── */
section.product-conts {
	margin-top: 2em;
}

.slide-mainvisual-thumbs {
	padding-top: 1.5em;
}

/* slide-mainvisual
─────────────────────────────────────────────────────────────────────────────────── */
.product-conts .column-main .slide-mainvisual {
	margin-bottom: 0;
}


/* column-main(PC　左カラム)
─────────────────────────────────────────────────────────────────────────────────── */

/* Color Variation */
.product-conts .color-variation {
	padding: .5em 3.5%;
}

.product-conts .color-variation .label {
	float: left;
	display: block;
	vertical-align: middle;
}
.product-conts .color-variation ul {
	display: block;
	vertical-align: middle;
	list-style: none;
	margin: 0;
	overflow: hidden;
}
.product-conts .color-variation li {
	float: left;
	list-style: none;
	display: table;
	table-layout: fixed;
	margin: 0 1em 0 0;
}
.product-conts .color-variation li span {
	display: table-cell;
	height: 1.6em;
	font-weight: bold;
	vertical-align: middle;
}
.product-conts .color-variation li span + span {
	padding-left: .583em;
}
.product-conts .color-variation span span,
.product-conts .color-variation span img {
	width: 1em;
	height: 1em;
}
.product-conts .color-variation span .color{
	border: 1px solid #d5d4d4;
}
.product-conts .color-variation .light-image img {
	width: auto;
}
.product-conts .color-variation > span {
	vertical-align: middle;
}

.pair-model .js-toggle-head .narrow-layout {
	padding: 0 3.5%;
}

/* SP < 768px */
@media print, screen and (max-width: 47.9em){

	.product-conts {
		padding: 0;
	}
	.product-conts .column-main {
		padding: 0;
		margin: 0;
		width: 100%;
	}

	/* Supplement Contents */
	.supplement-contents .column {
		padding: 0;
	}

	.supplement-contents .jp-middle-dot {
		padding-left: 0;
	}

	.supplement-contents .jp-middle-dot li {
		margin-top: 0;
		padding-left: 5%;
		line-height: 1.2;
	}

	.supplement-contents .jp-middle-dot li:before {
		left: 0;
	}

	.supplement-contents .jp-middle-dot li~li {
		margin-top: .5em;
	}

	.pair-model .js-toggle-head .narrow-layout {
		padding: 0;
	}
}

/* PC > 768px */
@media print, screen and (min-width: 48em){
	.product-conts .column-main {
		max-width: 43em;
		padding-left: 0;
		padding-right: 0;
	}

	/* Slider */
	.product-conts .slide-mainvisual .zoom {
		cursor: pointer;
	}
	.product-conts .slide-mainvisual .zoom:hover img {
		opacity: .75;
	}
	.product-conts .thumbs {
		width: 97%;
		margin: 0 1.5%;
	}
	.product-conts .slide-mainvisual-thumbs.swiper-container:before {
		width: 2%;
		left: -1%;
	}
	.product-conts .slide-mainvisual-thumbs.swiper-container:after {
		width: 2%;
		right: -1%;
	}
	.product-conts .slide-mainvisual .swiper-nav {
		left: -4%;
		right: -4%;
	}

	/* Zoom Icon */
	.product-conts .slide-mainvisual-content .swiper-slide.zoom {
		position: relative;
	}
	.product-conts .slide-mainvisual-content .swiper-slide.zoom:after {
		content: "";
		position: absolute;
		right: .1em;
		bottom: .1em;
		display: inline-block;
		overflow: hidden;
		width: 1.2em;
		height: 1.2em;
		font-size: 2em;
		background-image: url('../../../theme/images/icons.svg');
		background-repeat: no-repeat;
		background-size: 17em 113em;
		background-position: -11.9em -43.9em;
		background-color: #fff;
		background-color: rgba(255,255,255,.75);
		border-radius: 6px;
	}

	.product-conts .slide-mainvisual .swiper-slide.movie {
		margin: 0;
		max-width: 100%;
	}

	/* Color Variation */
	.product-conts .color-variation {
		padding: .5em 2%;
	}
	.watch-outline .color-variation span span,
	.watch-outline .color-variation span img {
		width: 1.25em;
		height: 1.25em;
	}

	/* Supplement Contents */
	.product-conts .supplement-contents {
		padding: 0;
	}

	.supplement-contents li {
		margin-top: 0;
	}

}

/* Overlay */
/* SP < 768px */
@media print, screen and (max-width: 47.9em){

	/* Destroy Overlay */
	.overlay-window,
	.overlay-screen {
		display: none !important;
	}

}

/* PC > 768px */
@media print, screen and (min-width: 48em){

	.overlay-window {
		position: absolute;
		display: none;
		height: auto !important;
	}

	/* Headers */
	.overlay-head {
		position: relative;
		padding: 2em 0;
		overflow: hidden;
	}
	.overlay-head:before {
		content: "";
		float: right;
		display: block;
		width: 15%;
		height: 3.5em;
	}

	.overlay-head .t-size-xx-large {
		float: left;
		max-width: 65%;
		margin: 0 5.5% 0 0;
		word-wrap: break-word;
	}

	.overlay-head .close {
		position: absolute;
		top: 0;
		bottom: 0;
		right: 0;
		display: inline-block;
		margin: auto;
		height: 1.6em;
		padding: 1em 0;
		font-weight: bold;
		cursor: pointer;
	}
	.overlay-head .close .icon {
		margin-left: .5em;
	}

	.overlay-head .logo {
		float: left;
		display: table;
		table-layout: fixed;
		max-width: 85%;
		font-size: 1.333em;
		font-weight: bold;
		height: 2.4em;
		margin-right: 1em;
	}
	.overlay-head .logo > span {
		display: table-cell;
		vertical-align: middle;
	}
	.overlay-head .logo > span img {
		display: block;
		margin: .375em 0;
	}

	.page-head .logo img {
		display: block;
		margin: .375em 0;
	}

	.overlay-head + hr {
		margin: 0 0 .934em;
	}

	/* Slider */
	.overlay-window .slide-mainvisual {
		margin-bottom: 0;
	}
	.overlay-window .slide-mainvisual .swiper-nav {
		left: -2.5%;
		right: -2.5%;
	}

}


/* column(PC　右カラム)
─────────────────────────────────────────────────────────────────────────────────── */

/* column */
div[class*="grid-"] .outline-watch {
	margin: 0 3.5%;
	padding: 0 0 .25em;
	width: 93%;
}

/* PC > 768px */
@media print, screen and (min-width: 48em){
	div[class*="grid-"] .outline-watch {
		margin: 0 1%;
		padding: .867em 1.5% .667em;
		width: 31.333%;
	}
}

/* PC > 768px *//* name */
@media print, screen and (min-width: 48em){
	.name:after {
		content: "";
		display: block;
		clear: both;
		height: 0;
		overflow: hidden;
	}
}

/* font-x-large */
.outline-watch .t-size-xx-large,
.outline-watch .t-size-x-large,
.outline-watch .t-size-large,
.outline-watch .t-size-small,
.outline-watch .t-size-x-small,
.outline-watch .t-size-xx-small {
	margin: .528em 0 .25em;
}

/* label-alert */
.outline-watch .label-alert {
	width: 100%;
	margin: 0;
	color: #100d0d;
}

/* PC > 768px */
@media print, screen and (min-width: 48em){
	.outline-watch .label-alert {
		float: left;
		line-height: 2.533em;
	}
}

/* price */
.outline-watch .price {
	margin: .267em 0 0;
}
.outline-watch .price span {
	margin-right: .267em;
}

/* PC > 768px */
@media print, screen and (min-width: 48em){
	.outline-watch .price {
		margin-top: .567em;
	}
}

/* button */
.outline-watch .spec-icons + [class*="txt-"] {
	padding: 1em 0 .75em;
}

/* SP < 768px */
@media print, screen and (max-width: 47.9em){
	.outline-watch .head + [class*="txt-"] {
		display: none;
	}

	.spec-icons a[class*="button"] {
		margin-top: 1em;
	}
}

/* PC > 768px */
@media print, screen and (min-width: 48em){
	.outline-watch .head + [class*="txt-"] {
		margin-top: 1.5em;
	}
}

/* spec */
.column.outline-watch .spec-icons {
	padding: .667em 0 0;
}

/* PC > 768px */
@media print, screen and (min-width: 48em){
	.column.outline-watch .spec-icons {
		padding-top: 2em;
	}
}


/* variation-list
─────────────────────────────────────────────────────────────────────────────────── */
/* header-grid column*/
.product-conts .js-toggle {
	padding: 0 2%;
}
.variation-list .header-grid .column {
	width: 97%;
	padding: 0;
}

/* SP < 768px */
@media print, screen and (max-width: 47.9em){
	.variation-list > section.js-toggle {
		margin-top: .25em;
	}
}

/* PC > 768px */
@media print, screen and (min-width: 48em){
	.product-conts .js-toggle {
		padding-bottom: 1em;
	}
	.variation-list {
		margin-top: 0;
	}
	.product-conts + .variation-list {
		margin-top: 6em;
	}
	.variation-list .header-grid .column {
		width: 98%;
		margin: 0 1%;
	}
}

/* hr */
.variation-list .t-size-x-large + hr {
	display: none;
}

/* toggle-body column*/
.variation-list .toggle-body {
	margin-top: .667em;
}

/* PC > 768px */
@media print, screen and (min-width: 48em){
	/* toggle-head */
	.variation-list .toggle-head {
		padding: 0;
		background: transparent;
		color: #100d0d;
	}

	/* toggle-body */
	.variation-list .toggle-body {
		margin-top: 0;
		padding-bottom: 1em;
	}
}


/* a */
.variation-list .figure > span,
.variation-list .figure a {
	position: relative;
	display: block;
	padding: 10px;
	border: 1px solid #dcdcdc;
	background: #fff;
	box-sizing: border-box;
}
.variation-list .figure a:hover,
.color-variation-list .column:first-child .figure > span {
	border-radius: 6px;
}
.variation-list .figure a:hover:after,
.color-variation-list .column:first-child .figure > span:after {
	content: "";
	position: absolute;
	top: -1px;
	bottom: -1px;
	left: -1px;
	right: -1px;
	border: 3px solid #003296;
	border-radius: 6px;
}
.variation-list .figure a:hover img,
.color-variation-list .column:first-child .figure span img {
	border: 0 none;
	border-radius: 6px;
}
/* tag */
.variation-list .column .figure .label-alert {
	position: absolute;
	top: 0;
	left: 0;
	margin: .597em 0 0 .498em;
	padding: 0;
}
.variation-list .figure a .label-alert mark {
	vertical-align: top;
}

/* PC > 768px */
@media print, screen and (min-width: 48em){

	/* font-x-large */
	.variation-list .t-size-xx-large,
	.variation-list .t-size-x-large,
	.variation-list .t-size-large,
	.variation-list .t-size-small,
	.variation-list .t-size-x-small,
	.variation-list .t-size-xx-small {
		margin: 0 0 1em;
	}

}


/* color-variation-list
─────────────────────────────────────────────────────────────────────────────────── */
/* font-x-small */
.color-variation-list .figure + .t-size-x-small {
	margin: .3em 0 .833em;
	text-align: center;
}

.color-variation-list .column {
	margin-bottom: 1em;
}

/* figure */
.color-variation-list .figure a,
.color-variation-list .figure > span {
	position: relative;
}

/* button */
.color-variation-list .button-alt {
	margin: 0 auto;
}
.color-variation-list .button-alt .icon {
	margin: 0 0 0 .5em;
}


/* js-more */
.color-variation-list .column:nth-child(n+5),
.color-variation-list .is-close [class*="txt-"] {
	display: block;
}
.color-variation-list .is-close .column:nth-child(n+4),
.color-variation-list [class*="txt-"] {
	display: none;
}

/* PC > 768px */
@media print, screen and (min-width: 48em){
	.color-variation-list .is-close .column:nth-child(n+4) {
		display: block;
	}

	.color-variation-list [class*="txt-"] button {
		display: none!important;
	}

	.color-variation-list .narrow-layout {
		padding: 0 3.5%;
	}
}
/* SP < 768px */
@media print, screen and (max-width: 47.9em){
	.txt-center .button-alt {
		display: inline-block;
	}

	.color-variation-list .narrow-layout .column {
		padding: 0 0%;
	}
	.color-variation-list .txt-center .button-alt {
		display: none;
	}
}


/* section
─────────────────────────────────────────────────────────────────────────────────── */


/* feature
─────────────────────────────────────────────────────────────────────────────────── */

/* feature-conts */
#feature .feature-conts {
	height: 9.6em;
	overflow: hidden;
}
#feature .feature-conts .js-cont-wrap {
	margin-bottom: 1.4em;
}
#feature .separator-line {
	display: none;
}
#feature .feature-conts .js-cont-wrap > p:first-child {
	margin-top: 0;
}

/* SP < 768px */
@media print, screen and (max-width: 47.9em){
	.feature-sub-contents > figure.column {
		margin: -1em 1.5%;
	}
	#feature .feature-conts + .column {
		margin-top: 1.2em;
	}
}

/* PC > 768px */
@media print, screen and (min-width: 48em){
	#feature .header-grid .underline {
		margin-bottom: 1em;
	}
	#feature .separator-line {
		display: block;
	}
	.narrow-contents .detail-list + [class*="grid"] .column {
		padding-bottom: 0;
	}
	.feature-sub-contents p {
		margin: 0 -5.5% 1.4em;
	}
	#feature .narrow-wrap .outer > hr {
		margin: 0 -2.5%;
	}
}

/* button */
#feature .button-small .icon {
	margin: 0 0 0 .5em;
}

/* button js-more*/
.more-head {
	display: none;
}
.more-head-close {
	display: block;
	margin-top: 1em;
}
.is-close .more-head {
	display: block;
	margin-top: 1em;
}
.is-close .more-head-close {
	display: none;
}

/* PC > 768px */
@media print, screen and (min-width: 48em){
	#feature .button-small {
		margin-left: -4%;
	}
	#feature .button-small {
		margin-top: 1.5em;
	}
	.feature-sub-contents + [class*="grid-"] [class*="txt-"] {
		margin-top: 1.5em;
	}
}


/* more-information
─────────────────────────────────────────────────────────────────────────────────── */

#more-information a[target="_blank"]:after {
	content: "";
	position: relative;
	top: .1em;
	display: inline-block;
	width: 1em;
	height: 1em;
	margin-left: .667em;
	background-image: url('../../../theme/images/icons.svg');
	background-repeat: no-repeat;
	background-size: 17em 113em;
	background-position: 0 -52em;
}


/* specification-watch
─────────────────────────────────────────────────────────────────────────────────── */
#specification-watch ul {
	margin-bottom: 0;
}
#specification-watch li {
	margin: .667em 0 0;
}
#specification-watch li:focus {
	outline: none;
}
#specification-watch li:first-child {
	margin-top: 0;
}

/* list 時計*/
.no-style-list {
	padding-left: 0;
}
.no-style-list + .more-body .no-style-list {
	margin-top: 0;
}
.no-style-list > li {
	padding-left: 0;
	list-style-type: none;
}
#specification-watch ul {
	margin-left: 2%;
}
#specification-watch ul.no-style-list {
	margin-left: 0;
}
#specification-watch ul > li > ul {
	margin-left: 4%;
}
#specification-watch ul > li > ul.no-style-list {
	margin-left: 4%;
}
.display-list {
	font-weight: bold;
}

/* list 電卓*/
#specification-watch li .figure {
	position: relative;
	float: left;
	width: 5.4em;
	height: 3em;
	margin: 0 1.333em .934em 0;
	background-color: #d5d5d5;
	background-image: url(../images/product/spec-icon-bg.png);
	background-image: linear-gradient(145deg, #ececec 25%, #e5e5e5 47.5%, #e0e0e0 50%, #d5d5d5 50%);
	background-repeat: no-repeat;
}
#specification-watch li .figure img {
	max-width: 100%;
	max-height: 100%;
	margin: auto;
}
#specification-watch li .figure + .specification-detail {
	margin-left: 5.733em;
}
#specification-watch li hr {
	clear: left;
}
.specification-name {
	display: block;
	font-weight: bold;
}
.specification-description {
	display: block;
	margin: 0 0 .934em 1em;
}
span[class^="specification-"] + hr {
	display: block;
	margin: .667em 0;
}
#specification-watch .display-list + .more-body .js-cont-wrap li:first-child {
	padding-top: .677em;
}


#specification-watch .details {
	position: relative;
	top: .5em;
}
#specification-watch .details:before {
	left: 6%;
}

/* SP < 768px */
@media print, screen and (max-width: 47.9em){
	#specification-watch .display-list + .more-body .js-cont-wrap {
		padding-left: 12%;
	}
	#specification-watch .column + .column .js-more > .no-style-list li:first-child {
		padding-top: 1em;
	}
}
/* PC > 768px */
@media print, screen and (min-width: 48em){
	#specification-watch li .figure + .specification-detail {
		min-height: 3.2em;
		margin-left: 13.8%;
	}
	#specification-watch .display-list + .more-body .js-cont-wrap {
		padding-left: 7%;
	}
}
/* SP < 768px */
@media print, screen and (max-width: 47.9em){
	#specification-watch li .figure + .specification-detail {
		min-height: 3.5em;
	}
}

/* button */
#specification-watch .border-list + .column  .button-small {
	margin-top: .833em;
}
#specification-watch .table-s2 + .txt-center {
	clear: both;
	margin-top: 1em;
}
#specification-watch .button-small .icon {
	margin: 0 0 0 .5em;
}
#specification-watch .button-small .icon-doc-blue-light {
	margin-right: .667em;
}

/* PC > 768px */
@media print, screen and (min-width: 48em){
	#specification-watch [class*="txt-"] {
		margin-left: -4%;
	}
}

/* button js-more*/
/*.more-body,
#feature .feature-conts {
	transition: height 0s cubic-bezier(0.86, 0.02, 0.36, 1);
}*/
.more-body {
	height: 0;
	margin: 0 -2%;
	padding: 0 2%;
	overflow: hidden;
}


/* related images
─────────────────────────────────────────────────────────────────────────────────── */


/* PC > 768px */
@media print, screen and (min-width: 48em){
	#related-images .figure {
		overflow: hidden;
	}
}

/* img */
#related-images .figure img {
	float: left;
	margin: 0 .6em .6em 0;
	max-width: 100%;
}

/* SP < 768px */
@media print, screen and (max-width: 47.9em){
	#related-images .figure img {
		float: none;
		margin: 0 auto .6em;
	}
}
