@charset "UTF-8";

* { margin: 0; padding: 0; }
body { color: #333; font-family: Helvetica,'Lucida Grande','Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3',Meiryo,'メイリオ','ＭＳ Ｐゴシック',sans-serif; font-size: 90%; line-height: 1.6; -webkit-text-size-adjust: 100%; }
img { border: 0; -ms-interpolation-mode: bicubic; }
a { outline: none; }
a:link { color: #; text-decoration: none; }
a:visited { color: #; text-decoration: none; }
a:hover { color: #; text-decoration: underline; }
a img:hover { opacity: 0.75; }
.clear { *zoom: 1; }
.clear::after { content: ''; display: block; clear: both; height: 0; }
.clearfix { /zoom: 1; }
.clearfix::after { content: ''; display: block; clear: both; height: 0; }

.flex-box { display: flex; }
.flex-wrap { flex-wrap: wrap; }

/* --------------------------------------------------
	TABLET
-------------------------------------------------- */

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
body { min-width: 1024px; zoom: 60% !important; }
}

/* --------------------------------------------------
	GLOBAL HEADER
-------------------------------------------------- */

header#globalHeader { background: #00997a; }
header#globalHeader div.inner { margin: 0 auto; width: 1200px;  }
header#globalHeader dl { display: flex; align-items: center; }
header#globalHeader dt a { padding: 20px 0; color: #fff; text-align: center; display: block; }
header#globalHeader dt a:hover { text-decoration: none; }
header#globalHeader dt span { display: block; }
header#globalHeader dt strong { font-size: 130%; display: block; }
header#globalHeader dd { padding: 0 80px; }
header#globalHeader dd nav#globalNavi { display: block; }
header#globalHeader dd ul { list-style: none; }
header#globalHeader dd li { margin-right: 20px; float: left; position: relative; }
header#globalHeader dd li a { padding: 10px 10px 10px 16px; color: #fff; display: block; position: relative; }
header#globalHeader dd li a::before { content: ''; margin: auto; width: 4px; height: 4px; border-top: solid 2px #fff; border-right: solid 2px #fff; vertical-align: middle; position: absolute; top: 0; bottom: 0; left: 0; transform: rotate(45deg); }
header#globalHeader dd li a:hover { text-decoration: none; }
header#globalHeader dd li ul { width: 300px; display: none; position: absolute; }
header#globalHeader dd li li { background: #00997a; border-top: solid 1px #fff; float: none; }
header#globalHeader dd li li a { padding: 10px 16px; white-space: nowrap; }
header#globalHeader dd li li a::before { border: none; }

@media screen and (max-width: 767px) {
header#globalHeader div.inner { width: auto; }
header#globalHeader dl { display: block; }
header#globalHeader dd nav#globalNavi { display: none; position: absolute; top: 30px; left: 30px; z-index: 3; }
header#globalHeader dd li { margin: 18px 0 15px 0; float: none; }
header#globalHeader dd li a { padding: 0 0 0 16px; color: #00997a; display: inline-block; }
header#globalHeader dd li a::before { border-top: solid 2px #00997a; border-right: solid 2px #00997a; }
header#globalHeader dd li ul { width: auto; display: block !important; position: static; }
header#globalHeader dd li li { margin: 15px 0 15px 32px; background: inherit; border-top: none; }
header#globalHeader dd li li a { padding: 0; white-space: normal; }
}

/* --------------------------------------------------
	PATH
-------------------------------------------------- */

div#path { margin: 20px auto; width: 1200px; }
div#path span { margin: 0 0.5em; }
div#path strong { font-weight: normal; }

@media screen and (max-width: 767px) {
div#path { margin: 20px 10px; width: auto; }
}

/* --------------------------------------------------
	MAIN, SECTION, &C
-------------------------------------------------- */

div#main { padding: 50px 20px; background: url(/files/uploads/1128058871.jpg) center no-repeat; background-size: cover; color: #fff; text-align: center; text-shadow: #333 1px 1px 10px, #333 -1px 1px 10px, #333 1px -1px 10px, #333 -1px -1px 10px; }
div#main h1 { font-size: 240%; }
div#main p { margin: 0 auto; max-width: 800px; }
section#contents { margin: 0 auto; padding: 0 0 50px; width: 1200px; }
h2 { margin: 25px 0; padding: 10px 16px; background: #eef3f4; border-left: solid 4px #00997a; color: #494949; font-size: 130%; }
article { margin: 0 auto; width: 1200px; }
div#page {}

@media screen and (max-width: 767px) {
div#main h1 { font-size: 180%; line-height: 1.4; }
section#contents { padding: 0 10px 30px 10px; width: auto; box-sizing: border-box; }
article { margin: 0 10px; width: auto; }
}

/* ---------- 素材一覧 ---------- */

ul#results { margin: 0; padding: 0; width: 1224px; list-style: none; display: flex; flex-wrap: wrap; justify-content: space-between; }
ul#results li { /*margin: 0 24px 24px 0; width: 384px;*/ margin: 0 0 24px; width: 282px; text-align: center; /*float: left;*/ }
ul#results a { margin: 0 0 10px; height: 240px; display: block; overflow: hidden; }
ul#results div {}
ul#results img { width: auto; max-width: 100%; height: auto; vertical-align: top; }
ul#results strong { font-size: 110%; display: block; }
ul#results span {}
ul#results span a { height: 0; display: inline; }
div.pagination { margin: 2em 0; text-align: center; }
div.pagination span.disabled, div.pagination span.prev, div.pagination span.next { margin: 0 1em; display: inline-block; }
div.pagination span.number { margin: 0 0.25em; background: #facb3c; border: solid 2px #facb3c; display: inline-block; }
div.pagination span.current { padding: 0.25em 0.75em; background: #fff; }
div.pagination span.number a { padding: 0.25em 0.75em; color: #333; display: inline-block; }
div.pagination span.number a:hover { background: #fff; text-decoration: none; }

@media screen and (max-width: 767px) {
ul#results { width: auto; display: block; }
ul#results li { margin: 0 0 24px 0; width: auto; float: none; box-sizing: border-box; }
ul#results a { height: auto !important; }
ul#results img { width: 100%; }
}

/* ---------- 素材詳細 ---------- */

div#detail { margin: 0 0 15px; }
div#detail div#images { width: 600px; float: left; }
div#detail div#images div#image { margin: 0 0 10px; }
div#detail div#images div#image img { width: 100%; height: auto; }
div#detail div#images ul { margin: 0; padding: 0; width: 610px; list-style: none; }
div#detail div#images li { margin: 0 10px 0 0; width: 112px; float: left; }
div#detail div#images li a { height: 75px; display: block; overflow: hidden; }
div#detail div#images li a img { width: 100%; height: auto; opacity: 0.25; }
div#detail div#images li a:hover img { opacity: 1; }
div#detail div#images li a.active img { opacity: 1; }
div#detail div#about { width: 570px; float: right; }
div#detail div#about table { margin: 1em 0; width: 100%; border-collapse: collapse; }
div#detail div#about th { padding: 6px 15px; background: #f0eae4; border: solid 1px #cfc9c4; }
div#detail div#about td { padding: 6px 15px; border: solid 1px #cfc9c4; }
div.map iframe { width: 100%; }

@media screen and (max-width: 767px) {
div#detail div#images { margin: 0 0 20px; width: auto; float: none; }
div#detail div#images div#main { margin: 0; }
div#detail div#images ul { width: auto; }
div#detail div#images li { margin: 5px 10px 5px 0; width: 75px; display: inline-block; }
div#detail div#images li a { height: 50px; }
div#detail div#about { width: auto; float: none; }
div#detail div#about table { border-top: solid 1px #cfc9c4; }
div#detail div#about th { border-width: 0 1px; display: block; }
div#detail div#about td { display: block; }
}

/* ---------- ブログ ---------- */

ul#post-list { margin: 0; padding: 0; list-style: none; }
ul#post-list li { padding: 12px 15px; border-bottom: solid 1px #e7ded3; }
ul#post-list span { display: block; }
ul#post-list p { margin: 0; }
article.post div.meta { margin: 20px 0; padding: 5px 20px; background: #f4f4f4; text-align: right; }
div.contents-navi { text-align: center; }

@media screen and (max-width: 767px) {
ul#post-list li { padding: 12px; }
article.post div.meta { padding: 5px 10px; }
}

/* --------------------------------------------------
	GLOBAL FOOTER
-------------------------------------------------- */

footer#globalFooter { padding: 30px 0; background: #00997a; color: #fff; text-align: center; }
footer#globalFooter div.inner { margin: 0 auto; width: 1200px; }

@media screen and (max-width: 767px) {
footer#globalFooter div.inner { width: auto; }
}

/* --------------------------------------------------
	OVERLAY & SMARTPHIONE MENU
-------------------------------------------------- */

div#overlay {}
a#sp { display: none; }

@media screen and (max-width: 767px) {
div#overlay { width: 100%; height: 0; background: rgba(255,255,255,0.9); position: absolute; top: 0; left: 0; z-index: 2; }
a#sp { width: 48px; height: 48px; background: rgba(255,255,255,0.9); border-radius: 3px; color: #00997a; font-size: 12px; text-align: center; text-decoration: none; line-height: 1; display: block; position: fixed; top: 40px; right: 10px; z-index: 3; transform: translateY(-50%); }
a#sp span { margin: 0 auto; width: 32px; height: 2px; background: #00997a; display: block; position: absolute; left: 0; right: 0; transition: all 0.3s; }
a#sp span:nth-of-type(1) { top: 8px; }
a#sp span:nth-of-type(2) { top: 16px; }
a#sp span:nth-of-type(3) { top: 24px; }
a#sp p { width: 100%; position: absolute; bottom: 4px; }
a#sp.active { background: none; color: #00997a; }
a#sp.active span { background: #00997a; }
a#sp.active span:nth-of-type(1) { transform: translateY(8px) rotate(-45deg); }
a#sp.active span:nth-of-type(2) { opacity: 0; }
a#sp.active span:nth-of-type(3) { transform: translateY(-8px) rotate(45deg); }
}

/* --------------------------------------------------
	iOS RESET
-------------------------------------------------- */

input[type="submit"], input[type="button"] { border-radius: 0; border: none; cursor: pointer; box-sizing: border-box; -webkit-appearance: button; appearance: button; -webkit-box-sizing: content-box; }
input[type="submit"]::-webkit-search-decoration, input[type="button"]::-webkit-search-decoration { display: none; }
input[type="submit"]::focus, input[type="button"]::focus { outline-offset: -2px; }