﻿@charset "utf-8";

/*
style-each.css @ tokaiopt2019
ver 1.0.0 
2019.3.11

__Based on:
	style-each.css @ tokaiopt2018 
	ver 1.3.1   
	2018.3.26
*/


a, .search-button, input, textarea, select {transition:all 0.0s linear 0s !important;}


/* =============================================
   Page or Post Styles
============================================== */

.chk-- {margin:0; color:crimson; text-align:center; font-style:italic; font-weight:bold; background:#aaa;}
.chk--filename {margin:0; color:white; text-align:center; font-style:italic; font-weight:bold; background:pink;}

#site-advice #co-kanban.bg-owhite {
	background:#f3f3f3 url(./img/bg/advice-h1.png) no-repeat right center;
	background-size:auto auto;
	background:#f3f3f3\9;
}
#site-news #co-kanban.bg-owhite {
	background:#f3f3f3 url(./img/bg/news-h1.png) no-repeat right 25%;
	background-size:auto auto;
	background:#f3f3f3\9;
}
#site-eyecare #co-kanban.bg-owhite {
	background:#f3f3f3 url(./img/bg/eyecare-h1.jpg) no-repeat right center;
	background-size:contain;
	background:#f3f3f3\9;
}
#site-product #co-kanban.bg-owhite {
	background:#f3f3f3 url(./img/bg/product-h1.png) no-repeat right center;
	background-size:contain;
	background:#f3f3f3\9;
}
#site-company #co-kanban.bg-owhite {
	background:#eef5fb url(./img/bg/company-h1.png) no-repeat right center;
	background-size:contain;
	background:#eef5fb\9;
}

#site-technology #co-kanban.bg-owhite {
	background:#eef5fb url(./img/bg/technology-h1.png) no-repeat right center;
	background-size:contain;
	background:#eef5fb\9;
}
#site-exhibit #co-kanban.bg-owhite {
	background:#f3f3f3 url(./img/bg/exhibit-h1.png) no-repeat right center;
	background-size:auto auto;
	background:#f3f3f3\9;
}
#site-tokaioptical #co-kanban.bg-owhite {
	background:#f3f3f3 url(./img/bg/tokaioptical-h1.png) no-repeat right center;
	background-size:auto auto;
	background:#f3f3f3\9;
}

h1 br+span {font-size:0.9rem; color:#666; font-weight:normal;}

.motto-miru {padding:1em; border:1px solid #999; text-align:center; color:#444; font-weight:bold; transition:all 0.33s linear 0s;}
.motto-miru:hover {transform:translateY(3px); transition:all 0.14s linear 0s;}
.motto-miru span {position:relative; display:inline-block;}
.motto-miru span::after {
	content:" "; width:10px; height:10px;
	position:absolute; right:-1.5em; top:50%; margin-top:-7.5px;
	border-right:2px solid #444;	border-top:2px solid #444;	
	transform:rotate(135deg);
}

.browse-back {clear:both; font-size:0.8em; font-weight:normal; border-top:1px solid #bcbcbc; margin:1.5em 0 4em;  padding:1.5em 0;}

.single-post h2.post-title {
	margin:0; padding:1.5em 0.75em; 
	color:#fff; font-weight:bold;
	background:linear-gradient(90deg,#0066B0 0%,#007fdc 100%);
	 /*IE 8,9=>*/ background:#007FDC\9;
}

.prev-or-next-title {width:100%; position:relative;}
.btn-pager {position:relative; display:inline-block; width:auto; min-width:9em; width:max-width:10em; height:3.5em; overflow:hidden; text-align:center;}
.btn-pager a {display:block; position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; padding:0.725em; color:#333;  border:1px solid #666; }
.prev-post {text-align:left;} 
.next-post {text-align:right;}
.prev-post .btn-pager a::after {
	content:" "; width:6px; height:6px;
	position:absolute; left:1em; top:50%; margin-top:-3px;
	border-right:1px solid #333; border-top:1px solid #333;
	transform:rotate(225deg);
}
.next-post .btn-pager a::after {
	content:" "; width:6px; height:6px;
	position:absolute; right:1em; top:50%; margin-top:-3px;
	border-right:1px solid #333; border-top:1px solid #333;
	transform:rotate(45deg);
}
.title-pager {display:block;width:100%; height:2em; padding:0; overflow:hidden;}
.prev-post .title-pager {text-align:left;}
.next-post .title-pager {text-align:right;}
.title-pager a {
	width:100%; height:100%; display:block; text-decoration:underline;
    overflow: hidden; text-overflow: ellipsis;  white-space: nowrap;
}


.get-related-posts {background:#f3f3f3; padding:0.25em 0.75em;}
.get-related-posts .trio {padding:0 0.5em 1em;}
.get-related-posts .imgframe {position:relative;display:block; width:100%; max-width:768px; background-size:cover; background-repeat:no-repeat; background-position:center center;}
.get-related-posts .imgframe:before {content:""; display: block; padding-top:70%;}
.get-related-posts h2 {border:none; margin:0.25em 0 0.75em; padding:1em 0 0; line-height:1.25; font-size:120%; font-weight:bold;}
.get-related-posts h2 a {border-bottom:1px solid #3385c1;}
.get-related-posts h2 + p {margin:0 0 0.5em; font-size:90%; line-height:1.5;}


#sidebar-inner ul {padding:0;}
#sidebar-inner h2 {background:#f3f3f3; color:#222; font-size:125%; font-weight:bold; padding:0.75em 0.5em; line-height:1.35; margin:1em 0 0.5em;}
#sidebar-inner ul li {
	border-bottom:1px solid #bcbcbc;
	width:100%; 	margin:0; padding:0.75em 0;
}
#sidebar-inner .search-box-blue {padding:3px; background:#3385c1;}
#sidebar-inner .search-box-inner {width:100%; border:1px solid rgba(0255,255,255,0.6); padding:1.5em 0.5em 0.5em; margin:auto; color:#fff; text-align:center; font-weight:bold; line-height:1.35;}
#sidebar-inner .search-box-blue br+span {font-size:0.7em;}

#sidebar-inner #searchform  {width:90%; height:36px !important; display:block; border:1px solid #bcbcbc; background:#fff; overflow:hidden; border-radius:18px; margin:1em auto; text-align:left; /*IE 8,9=>*/ background:#eee\9; }
#sidebar-inner #searchform input#s {float:left; display:inline-block; width:calc(100% - 36px); height:36px !important; border:none !important; padding:2px 3px 2px 0.8em; /*IE 8,9=>*/ width:81%\9; }
#sidebar-inner #searchform input#s::placeholder {content:"検索"; color:#999;}
#sidebar-inner #searchform input#searchsubmit { display:inline-block; 
	float:right; width:36px; height:36px !important; margin:0 !important; padding:6px 12px; border:none !important;
	background:rgba(230,230,230,0.85) url(./img/icon/search-blue.png) no-repeat center center; background-size:18px; color:transparent;
	/*IE 8,9=>*/ background: url(./img/icon/search-blue.png) no-repeat center center\9;
}
#sidebar-inner #searchform label.screen-reader-text {display:none;}

#news-topics .duo {position:relative; padding-right:0.5em;}
.is-ipad #news-topics {text-align:center;}
.is-ipad #news-topics .duo {float:none; margin:auto; text-align:left;}

.blog-cat-list ul li {
	position:relative; 
	height:3.5em; line-height:1.25em; font-size:88%;
}

.blog-cat-list ul li a { 
	position:absolute; top:0; right:0.5em; bottom:0; left:0;
	display:flex; align-items:center;
	padding:1em 1.5em 1em 0em;
	background:#fff; text-align:left;
	color:#444;
	
}
.blog-cat-list ul li a:hover {color:salmon;}
.blog-cat-list ul li a::after {
	content:" "; width:8px; height:8px;
	position:absolute; right:6px; top:50%; margin-top:-4px;
	border-right:2px solid #3385c2;	border-top:2px solid #4bf;
	transform:rotate(45deg);
	transition:all 0.14s linear 0s;
}
.blog-cat-list ul li a:hover::after {
	content:" "; width:10px; height:10px;
	position:absolute; right:3px; top:50%; margin-top:-5px;
	border-right:2px solid salmon;	border-top:2px solid salmon;
	transform:rotate(45deg);
	transition:all 0.14s linear 0s;
}


.blog-archive-list select {width:100%; border-radius:8px; border:1px solid #888; padding:0.75em 0.5em;}
	


.get-new-posts .imgframe {position:relative;display:block; width:100%; max-width:200px; background-size:cover; background-repeat:no-repeat; background-position:center center;}
.get-new-posts .imgframe:before {content:""; display: block; padding-top:70%;}
.get-new-posts h2 {border:none; margin:0.25em 0 0.75em; padding:0; line-height:1.25; font-size:120%; font-weight:bold;}
.get-new-posts h2 a {border-bottom:1px solid #3385c1;}
.get-new-posts h2 + p {margin:0 0 0.5em; font-size:90%; line-height:1.5;}
.get-new-posts .blue-label {display:inline-block; background:#3385c1; color:#fff; padding:0 0.5em; font-size:0.8em; line-height:1.5; vertical-align:middle;}
.get-new-posts .new {display:inline-block; color:crimson; font-weight:bold; padding:0; font-size:0.9em; line-height:1.5; vertical-align:middle;}

#old-posts h2 {color:#222; font-size:120%;font-weight:bold; padding:0.75em 0; margin:3em 0 1em; border-bottom:1px solid #222;}
#old-posts h2 span {display:inline-block; font-size:0.75rem; color:#bbb; font-weight:normal;}
.old-post-list li {margin:0.75em 0;}
.old-post-list.type-news {padding:0;}
.old-post-list.type-news table {margin:0;}
.old-post-list.type-news li th {vertical-align:top; width:8em; font-size:0.8em; padding:0.25rem 0; border:none; background:#fff; white-space:nowrap; line-height:1.35;}
.old-post-list.type-news li td {vertical-align:top; font-size:1em; padding:0.25rem 0; border:none; background:#fff; line-height:1.35;}

#cta-box h3 {margin:0; padding:0; font-size:1.15em; font-weight:bold; color:#0066b1;}
#cta-box p {margin:0.5em 0; line-height:1.35;}
#cta-box .tel-number {display:inline-block; margin:0; padding:0; font-size:1.6em; font-weight:normal; color:#0066b1;vertical-align:-10%;}

a.btn-blue {position:relative; display:inline-block; color:#FFF; font-weight:bold; margin:1em 0; padding:0.5em 3em; border:2px solid transparent; background:rgba(0,104,177,1.0); background:linear-gradient(120deg,#0068b1 0%,#0068b1 50%,#0154a2 50%,#0154a2 100%); /*IE 8,9=>*/ background:#0066b1\9; }
a.btn-blue:hover {color:#fff; background:rgba(0,104,177,1.0); background:linear-gradient(120deg,#3385c1 0%,#3385c1 50%,#0068b1 50%,#0068b1 100%); border:2px solid rgba(0,104,177,1.0); /*IE 8,9=>*/ background:#3385c1\9; }

a.btn-blue::after {
	content:" "; width:6px; height:6px;
	position:absolute; right:1em; top:50%; margin-top:-3px;
	border-right:1px solid #fff;	border-top:1px solid #fff;
	transform:rotate(45deg);
	transition:all 0.14s linear 0s;
}
a.btn-blue:hover::after {
	content:" "; width:8px; height:8px;
	position:absolute; right:0.75em; top:50%; margin-top:-4px;
	border-right:2px solid #fff;	border-top:2px solid #fff;
	transform:rotate(45deg);
	transition:all 0.14s linear 0s;
}

.wp-caption  { max-width:100% !important;}

.post img, .wp-caption img {width:auto; max-width:100% !important; height:auto !important;}


.swiper-container0 {
	position:relative;
	width:100%; height:auto; min-height:380px;
	text-align:center; margin:0 auto; padding-bottom:1em;
	overflow:visible;
	transition:all 0.5s linear 0s;
}
.swiper-container0 .swiper-slide {
	width:80%; min-width:260px; max-width:300px; height:100%;
	margin:0 auto 0; text-align:center;
	overflow:visible;
}
.swiper-button-prev {left:-0.5em;}
.swiper-button-next {right:-0.5em;}
.swiper-button-next, .swiper-button-prev {opacity:1; transform:scale(0.85); transition:all 0.3s linear 0s;}
.swiper-button-next:hover, .swiper-button-prev:hover {opacity:1; transform:scale(1); transition:all 0.14s linear 0s;}






@media only screen and (min-width: 768px) and (max-width: 1169px) {
	
	.container {max-width:835px !important; margin:auto;}
	
}


/* PC display 996px */
@media only screen and (min-width:996px) {

	.single-post {padding:0; min-width:825px !important;}

}

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

	
}

@media only screen and (min-width: 768px) {
	#sidebar-inner .search-box-blue {margin-top:0 !important;}
}

@media only screen and (min-width: 658px) {
	#site-advice #co-kanban h1 {margin:1.35em auto;}
}

/* All Mobile Sizes */
@media only screen and (max-width: 767px) {

	.container {padding:0;}
	.single-post {padding:0;}
	.single-post article {padding:0 1em;}
	
	#site-advice #co-kanban.bg-owhite {
		background:#f3f3f3 url(./img/bg/advice-h1-smoke.png) no-repeat right center;
		background-size:auto auto;
	}
	#site-eyecare #co-kanban.bg-owhite {
		background-size:cover;
	}
	#site-product #co-kanban.bg-owhite {
		background-size:cover;
	}
	#co-kanban h1 {text-shadow:1px 1px 0px #fff, 2px 2px 1px #fff;}

}


/* Mobile Portrait Size to Mobile Landscape Size */
@media only screen and (max-width: 479px) {

	.single-post article {padding:0 0.5em;}
	.get-related-posts h2 {text-align:center; margin-bottom:1.5em;}

}




/* ************************************************ */


@media only screen and (min-width:825px) and (max-width: 1169px) {

	.container, .wide-container {padding:0 5px; text-align:center;}
	#main-column.three-quarters, #sub-column.quarter {width:100%; max-width:825px !important; text-align:left;}
	#main-column.three-quarters { margin:0.5em auto 2em !important; padding:0 !important;}
	#sub-column.quarter { margin:0.5em auto !important; padding:2em 0 0 !important;}

}


/* Mobile Single Column ( like 7 inch Tablet ) */
@media only screen and (max-width: 824px) {
	
	.container, .wide-container {padding:0 0.3em;}
	#main-column.three-quarters, #sub-column.quarter { width:98%; max-width:auto;}
	#main-column.three-quarters { margin:0.5em 1% 2em !important; padding:0 !important;}
	#sub-column.quarter { margin:0.5em 1% !important; padding:2em 0 0 !important;}

}


