/*
 * PHOTO YODOBASHI v3.0
 */
@charset "UTF-8";

.col-md-12 h1 { margin-top: 40px; margin-bottom: 0 !important; padding-bottom: 0; font-size: 170%; line-height: 1.7em; }
.col-md-12 h1 span { font-size: 80%; }
.col-md-12 h2 { padding-top: 20px; padding-bottom: 5px; font-size: 160%; }
.col-md-12 h3 { font-size: 150%; font-weight: bold; }
.col-md-12 h4 { font-size: 130%; }
.col-md-12 p { font-size: 120%; line-height: 1.6; }

p.logo { margin: 80px 0 30px 0; text-align: center; }
p.logo img { width: 160px; height: auto; }

.top_index { margin-bottom: 80px; }
.top_index .col-md-4 { padding: 8px; }
.top_index .col-md-4:nth-child(3n+1) { clear: both; }
.top_index .col-md-4 div { padding: 15px; border: solid 1px #ccc; border-radius: 3px; }
.top_index .col-md-4 div:hover { background: #eee; }
.top_index .col-md-4 div a { color: #000; text-decoration: none; }
.top_index .col-md-4 div img { border-radius: 2px; } 
.top_index .col-md-4 div h3 { padding: 18px 0 0 0; font-size: 14pt; font-weight: normal; text-align: center; }
.top_index .col-md-4 div p { margin-bottom: 5px; font-size: 12pt; }

div.backnumber { margin: 80px 0 50px 0; clear: both; }
div.backnumber h3 { font-size: 130% !important; margin: 0 0 8px 0 !important; padding: 0 0 5px 0 !important; font-size: 140% !important; text-align: left !important; }
div.backnumber ul { list-style: none; margin: 0; padding: 0; border-top: dotted 1px #888; border-bottom: dotted 1px #888; }
div.backnumber ul:after { content: "."; display: block; height: 0; font-size:0; clear: both; visibility: hidden; }
div.backnumber ul li { width: 50%; margin: 0; padding: 0; border-bottom: dotted 1px #888; float: left; }
div.backnumber a { width: 100%; height: 88px; margin: 4px 0; padding: 4px 10px 4px 0; color: #000; display: block; }
div.backnumber a:hover { background: #ddd; border: none; border-radius: 5px; }
div.backnumber img { width: auto; height: 80px; margin: 0 15px 0 5px; padding: 0; border: none; border-radius: 3px; float: left; }

@media screen and (min-width: 761px) {
	div.backnumber ul li:nth-child(2n+1):last-child { border-bottom: none; }
	div.backnumber ul li:nth-child(2n):last-child { border-bottom: none; }
	div.backnumber ul li:nth-child(2n+1):nth-last-child(+2) { border-bottom: none; }
}
@media screen and (max-width: 760px) {
	div.backnumber ul li { width: 100%; float: none; }
	div.backnumber ul li:last-child { border-bottom: none; }
}

@media screen and (min-width: 761px) {
section.cart div.col-md-6:nth-child(2n+1) { clear: both; }
}

ul.categories { margin: 40px 0; padding: 0; list-style: none; clear: both; }
ul.categories:after { content: "."; height: 0; clear: both; display: block; visibility: hidden; }
ul.categories > li { display: inline; margin-right: 6px; }
ul.categories > li > a { padding: 6px 10px; color: #fff; background: #888; text-decoration: none; border: none; border-radius: 3px; }
/* ul.categories > li > a:hover { color #555; background: #ccc; } */

.col-md-12 section h1 { padding: 20px 0; }
.col-md-12 section h2 { padding: 30px 0 30px; font-size: 170%; font-weight: bold; text-align: center; line-height: 1.4em; }
.col-md-12 section h4 { margin: 50px 0 25px 0; font-size: 165%; font-weight: bold; }
.col-md-12 h3 { padding: 60px 0 30px; font-size: 170%; font-weight: normal; text-align: center; line-height: 1.4em; }
.col-md-12 h3 span { font-size: 80%; }
.col-md-12 section p.lead { margin-bottom: 80px; }
.col-md-12 section p.q { margin: 50px 0 25px 0; color: #555; font-weight: bold; }

p.top { margin-bottom: 80px; }
p.lead { margin-top: 60px; }

.index_head {}
.index_head h1 { margin-bottom: 15px; font-size: 220%; line-height: 1.4em; }
.index_head h1 span { font-size: 70%; line-height: 0.8em; write-space: nowrap; }
.index_head h2 { margin: 5px 0 40px 0; padding: 0; font-size: 140%; text-align: center; line-height: 1.3em; }
.index_head p.center { margin-top: 10px; line-height: 1.4; }
.index_head ul { clear: both; }
.index_head ul li { font-size: 110%; }

ul.article_index { margin: 50px 0 0 0; padding: 0; list-style: none; border-top: solid 1px #000; }
ul.article_index > li:after { content: "."; height: 0; clear: both; display: block; visibility: hidden; }
ul.article_index > li { margin: 0; padding: 20px 0; border-bottom: solid 1px #000; }
ul.article_index > li a { color: #000; }
ul.article_index > li .col-md-4 { padding: 0; }
ul.article_index > li .col-md-4 img { margin-bottom: 0 !important; }

@media (min-width: 992px) {
ul.article_index li .col-md-8 { padding: 0 0 0 30px; }
}
@media (max-width: 991px) {
ul.article_index li .col-md-8 { padding: 20px 0 0 0; }
}

ul.article_index > li .col-md-8 h2 { margin: 0; padding: 0; font-size: 220% !important; font-weight: bold !important; text-align: left !important; line-height: 1.4em; }
ul.article_index > li .col-md-8 h3 { margin: 0; padding: 0; font-size: 130% !important; font-weight: medium !important; text-align: left !important; line-height: 1.4em; }
ul.article_index > li .col-md-8 div.tag { margin: 15px 0; }
ul.article_index > li .col-md-8 div.tag span { margin: 0 8px 0 0; padding: 3px 5px 3px 6px; font-size: 95%; color: #fff; background: #626262; border: none; border-radius: 1px; }
ul.article_index > li .col-md-8 p { margin: 0; padding: 0; line-height: 1.6; }

ul.categories { margin: 20px 0; padding: 0; list-style: none; clear: both; }
ul.categories:after { content: "."; height: 0; clear: both; display: block; visibility: hidden; }
ul.categories li { display: inline; margin-right: 4px;  padding: 5px 8px; background: #888; color: #fff; text-decoration: none; border: none; border-radius: 3px; }

ul.article_index li.id502 { opacity: 0.3; }

.x3youtube {  width: 100%; margin-bottom: 30px; padding: 0; list-style: none; }
.x3youtube:after { content: "."; height: 0; clear: both; display: block; visibility: hidden; }
.x3youtube li { width: 318px; aspect-ratio: 16 / 9; margin-right: 3px; float: left; }
.x3youtube li:nth-child(3n) { margin-right: 0; }
.x3youtube li iframe { width: 100%; height: 100%; }
@media screen and (max-width: 991px) {
.x3youtube li { width: 100%; aspect-ratio: 16 / 9; margin: 0 0 30px 0; float: none; }
}

.item { width: 100%; }
.item > h2 { margin: 20px 0; padding: 10px 0 !important; font-size: 180%; text-align: left !important; }
.item > h3 { margin: 0; padding: 10px 0 !important; font-size: 140%;  text-align: left; }
.item > p { margin: 0; padding: 10px 0; font-size: 110%; line-height: 1.6em; }
.item > ul.cat { margin: 30px 0; padding: 0; list-style: none; clear: both; }
.item > ul.cat:after { content: "."; height: 0; clear: both; display: block; visibility: hidden;  } 
.item > ul.cat li { margin: 0 10px 10px 0; padding: 3px 8px; font-size: 100%; color: #fff !important; background: #555; line-height: 2em; border: none; border-radius: 5px; white-space: nowrap; float: left; }
.item > ul.cat li a { color: #fff; }

section.header > img { margin-bottom: 0; }
.col-md-12 h1 { margin: 40px 0; font-size: 240%; }
.col-md-12 h2 { margin: 0;}

p.continue { margin-top: 20px　!important; font-size: 90%; text-align: right; }
