@charset 'UTF-8'; 
/*
Theme Name:Galerie Orphee
Theme URI:https://www.g-orphee.com
Author:mizuho ogino
Author URI:https://web.contempo.jp
*/


/* ::::::::::: BODY and COLOR THEME ::::::::::: */
*, *::before, *::after { border-color:#cacbcb; }
#toggle-menu, .title-box { background:#50585a; background:rgba(80,88,90,0.65); }
html, body { background-color:#f4f4f4; color:#383b41; }
a, [type="submit"] { font-weight:normal; color:#4d5052; text-decoration:none; outline:0; cursor:pointer; }
.entry a, ul.blogroll li a { color:#448791; }
.roman { color:#8e9ca0; }
.entry a:hover, button:hover, [type="submit"]:hover { color:#288f9e; }
a:hover .roman, button:hover .roman, [type="submit"]:hover .roman { color:#82cbd2; }
input, textarea { color:#3c544d; }
.date.roman { color:#e1e9eb; }
b, .entry strong { color:#895472; }
.bg-box, .bg-box a:hover, a.next-post-Link:hover, [type="submit"], .current, a.box-link:hover, a.page-numbers:hover, a.bg-box:hover { color:#fff; background:rgba(111,89,99,0.4); }
a.bg-box:hover, [type="submit"]:hover, button:hover { color:#fff; background:#e6b0ce; background:rgba(200,90,137,0.5); }
#menu-box { color:#aaa; }
#menu-box .border strong { color:#fff; }
#menu-box * { border-color:#4e4046; }
#menu-box a { color:#fff; }
#menu-box a:hover { color:#ddb0c4; }
#menu-box #logo { float:none; width:auto; margin:0 0 0 20px; padding:0; }
.archive-list span { color:#8c8789; }
@media screen and ( max-width : 980px ){
  body { transition:.5s ease-out; }
}
@media screen and ( min-width : 769px ){
  #wrapper::before { content:' '; z-index:0; display:block; position:absolute; left:0; top:0; bottom:0; width:320px; background-color:#1e1e1d; }
}
@media screen and ( max-width : 768px ){
  body.open #menu-box { background-color:#1e1e1d; }
  #menu-box #logo { margin:0; padding:0; }
}
@media screen and ( max-width : 479px ){
  .date.roman { color:#8e9ca0; }
}
::-moz-selection { background-color:#699; color:#fff; } 
::selection { background-color:#699; color:#fff; }



/* ::::::::::: BLOG ::::::::::: */ 
#contents { margin-bottom:10px; }
#contents #posts-navi { padding-top:25px; }
#contents a.next-post-Link { overflow:hidden; width:auto; display:block; }
#contents a.next-post-Link img { margin:0 5px; display:none; float:right; }

div.blog { padding:0; position:relative; z-index:2; overflow:hidden; }
div.blog .slideshow { margin-top:25px; }
section.blog-box, div.blog div.next-post-Link { margin:0; }
section.blog-box { position:relative; margin-top:25px; }
section.blog-box div.date { position:absolute; right:0; top:-5px; z-index:-1; font-size:5em; line-height:1em; }
section.blog-box div.date span { margin-right:.2em; }
div.blog div.next-post-Link { padding:10px; height:15px; padding:10px; }
div.blog .border { padding:20px 50px; border-bottom-width:1px; border-bottom-style:solid; background:none; }
div.blog .border h2 { font-size:24px; text-align:left; }
div.blog div.author { float:right; font-size:10px; margin:-20px 10px 0 0; }
div.blog .weblink { clear:both; text-align:center; }
div.blog .weblink a { font-size:1.05em; padding:15px; }
div.blog .weblink a i { font-size:1.15em; margin-right:.3em; color:#fff; }
div.blog a.permalink { padding:10px 0 0 30px; }
#contents .container { padding:40px 70px; margin:0; width:auto; max-width:800px; }
#contents .blog-box div.entry p { margin:8px 0; text-indent:0; }

a.blog-link .border { padding:10px 50px 5px 30px; }
#contents div.blog a.blog-link .entry { padding-bottom:10px; }
#contents div.blog a.blog-link .entry p { margin:0; }
#contents a.blog-link .thumbnail { height:160px; width:160px; display:block; overflow:hidden; float:left; margin:10px 25px; }
#contents a.blog-link .thumbnail img { width:160px; height:auto; }
a.blog-link img.readmore { visibility:hidden; position:absolute; bottom:10px; right:10px; }
a.blog-link:hover img.readmore { visibility:visible; }
a.blog-link .blog-box { padding-bottom:10px; }
div.blog .edit-button { position:absolute; right:0; bottom:0; }
.social-buttons { padding:20px; margin-right:20px; }
.social-buttons > li.button-twitter a { border-color:#5b9bb0; color:#5b9bb0; }
.social-buttons > li.button-twitter a:hover { background-color:#9bd6e9; }
.social-buttons > li.button-facebook a { border-color:#695bb0; color:#695bb0; }
.social-buttons > li.button-facebook a:hover { background-color:#c7bdf4; }
.social-buttons > li.button-gplus a { border-color:#b16142; color:#b16142; }
.social-buttons > li.button-gplus a:hover { background-color:#f2cbbb; }
.social-buttons > li.button-hatebu a { border-color:#5b79b0; color:#5b79b0; }
.social-buttons > li.button-hatebu a:hover { background-color:#adc2f1; }
.social-buttons > li.button-line a { border-color:#4c994e; color:#4c994e; }
.social-buttons > li.button-line a:hover { background-color:#b6eeab; }
.social-buttons > li.button-pinterest a { border-color:#b05b6d; color:#b05b6d; }
.social-buttons > li.button-pinterest a:hover { background-color:#f0adba; }
#contents ul.news-list { margin-top:0; padding-top:0; }
#contents ul.news-list li { width:49%; float:left; }
#contents ul.news-list li a { height:80px; padding:10px; }
#contents ul.news-list li:nth-child(even) { margin:0 1% 10px 0; }
#contents ul.news-list li:nth-child(odd) { margin:0 0 10px 1%; }
#contents ul.news-list li:first-child { width:100%; margin:0 0 10px 0; }
#contents ul.news-list li:first-child a { height:auto; text-align:center; }


/* ::::::::::: CHANNEL ::::::::::: */
.channel {}
.channel::after { clear:both; visibility:hidden; display:block; content:" "; height:0; overflow:hidden; }
.channel > div a { display:block; display:table; width:100%; }
.channel > div a > span { display:block; display:table-cell; vertical-align:middle; }
.channel > div .image { overflow:hidden; width:90px; height:90px; background:#eee; position:relative; z-index:1;   border-radius:2px; }
.channel > div .image img { position:absolute; top:0; left:0; height:100%; width:100%; z-index:2; }
.channel > div .title { width:70%; }
.channel > div .title .date { display:block; font-size:10px; }
.channel > div .image::before { position:absolute; z-index:3; margin:auto; font-size:30px; width:30px; height:30px; text-align:center; top:0; right:0; left:0; bottom:0; display:block; background:rgba(0,0,0,0.1); color:#fff; font-family:'fontello'; }
.channel > div.prev { width:50%; float:left; }
.channel > div.prev .image { float:left; }
.channel > div.prev .image::before { content:'\e81e'; }
.channel > div.prev .title { text-align:left; padding:10px 15px 10px 10px; }
.channel > div.next { width:50%; float:right; }
.channel > div.next .image { float:right; }
.channel > div.next .image::before { content:'\e826'; }
.channel > div.next .title { text-align:right; padding:10px 10px 10px 15px; }
@media screen and (max-width:1200px){
  #contents .container { padding:30px 40px; }
  div.blog div.date { font-size:4.4em; }
}
@media screen and (max-width:980px){
  div.blog div.date .week { display:none; }
  #contents .container { padding:25px 30px; }
  .channel { padding-bottom:0; padding-top:0; border-top:none; }
  .channel > div.prev, .channel > div.next { width:100%; float:none; border-top:1px dotted #aaa; padding:8px 0; }
  .channel > div.next { border-bottom:1px dotted #aaa; }
  .channel > div.prev .title { text-align:right; }
  .channel > div.next .title { text-align:left; }
  .channel > div .image { width:80px; height:80px;   border-radius:50%; }
  #comments { padding:20px 40px; }
  div.blog .border h2 { font-size:21px; }
  #contents a.blog-link .thumbnail { height:140px; width:140px; margin:10px 18px; }
  #contents a.blog-link .thumbnail img { width:140px; height:auto; }
}
@media screen and (max-width:768px){
  div.blog div.date { position:static; right:auto; top:auto; margin-left:10px; z-index:1; }
}
@media screen and (max-width:600px){
  #contents .container { padding:25px; }
  div.blog .border h2 { font-size:20px; }
  #contents a.blog-link .thumbnail { height:120px; width:120px; margin:7px 15px 7px 0; }
  #contents a.blog-link .thumbnail img { width:120px; height:auto; }
  #contents ul.news-list li { width:100%; float:none; margin:0 0 10px 0!important; }
  #contents ul.news-list li a { height:70px; padding:10px; }
  #contents ul.news-list li a img { width:50px; height:50px; }
}
@media screen and (max-width:479px){
  div.blog div.date { position:static; right:auto; top:auto; margin-left:10px; z-index:1; font-size:3em; }
  div.blog div.date .year { font-size:.8em; }
  div.blog .border h2 { font-size:18px; }
  #contents a.blog-link .thumbnail { height:90px; width:90px; margin:7px 10px; }
  #contents a.blog-link .thumbnail img { width:90px; height:auto; }
}




/* ::::::::::: COMMENTS FORM ::::::::::: */
#comment-list { padding:15px 0; margin:0; }
#comment-list > li.comment { padding:0 0 50px; margin:0; display:block; position:relative; background:#eae8e2; font-size:.92em; line-height:1.6em; }
#comment-list > li.comment.byuser { background:#e4f4f4; }
#comment-list li.depth-1 { margin-top:40px; }
#comment-list ul.children { display:block; overflow:hidden; }
#comment-list > li:first-child { margin-top:5px; }
#comment-list::after, #comment-list > li:first-child::after { display:block; clear:both; content:' '; height:0; overflow:hidden; visibility:hidden; }
#comment-list + #respond-header { margin-top:20px; padding:10px 0; }
#comment-list li::after{ content:''; display:block; clear:both; overflow:hidden; visibility:hidden; }
.comment-meta { margin:0; background:#fff; position:relative; }
#comment-list > li.comment > .comment-meta { background:#f9f8f5; }
.comment-meta .editlink { display:inline-block; float:none; text-align:left; padding:0; }
.comment-meta .editlink a { padding:2px 4px; border-radius:2px; margin-left:10px; }
.comment-meta::after{ content:''; display:block; clear:both; overflow:hidden; visibility:hidden; }
.avatar { display:block; margin-right:10px; }
.comment-date { font-size:.9em; color:#777; margin:0; float:right; padding:0; }
.comment-author { padding:0 0 4px; font-size:1.1em; line-height:1.5em; float:left; }
.comment-author span, .comment-author a { font-weight:bold; text-decoration:none; color:#7b8282; }
.comment.byuser .comment-author span, .comment.byuser .comment-author a { color:#5e8f92; }
.comment-author a:hover { text-decoration:underline; }
.comment-reply-link { position:absolute; z-index:10; font-size:15px; line-height:15px; bottom:10px; right:10px; left:35px; text-align:center; padding:12px; border:1px solid #fff; }
.comment-reply-link:hover { color:inherit; }
.comment-text { clear:both; padding:17px 24px; border-top:1px dotted #aaa; text-align:justify; }
.comment-text.closed { line-height:1em; }
.comment-text p { }
.comment-text pre { clear:both; margin:8px 0; }
.comment-text p.moderation { color:#aaa; font-size:1em; font-weight:bold; }
.comment-text a { text-decoration:underline; }
#comment-list li.comment ul.children { padding-left:35px; padding-right:10px; padding-bottom:10px; }
#comment-list li.comment ul.children > li.comment { padding:6px 10px; background:#fff; display:block; margin-top:6px; font-size:.95em; line-height:1.5em; }
#comment-list li.comment ul.children > li.comment .comment-text { padding:8px 0 0; }
#comments .note, #comments .nopassword { margin:0; font-size:.75em; }
#comments .nopassword { padding-left:30px; }
#comments > p.roman { height:16px; padding:5px 0 2px 0; clear:both; display:block; }
#comments .message { height:16px; padding:5px 0; clear:both; display:block; }
#respond { width:100%; position:relative; padding:0 0 130px 0; margin-bottom:30px; }
body.logged-in #respond { padding:0; }
#respond::after { content:" "; display:block; height:0; clear:both; visibility:hidden; }
p.comment-form-author, p.comment-form-email, p.comment-form-url, p.comment-form-captcha { position:absolute; width:40%; max-width:40%; }
p.comment-form-author { bottom:65px; left:0%; }
p.comment-form-captcha { bottom:65px; left:42%; }
p.comment-form-email { bottom:0; left:0%; }
p.comment-form-url { bottom:0; left:42%; }
form, input, textarea { margin:0; }
#comments input:not([type="submit"]), textarea { font-size:16px; border:none; margin:0; text-align:justify; vertical-align:baseline; border:1px solid #ddd; background-color:#fff; border-radius:2px;   padding:6px 8px; }
#comments input { height:32px; width:100%; }
p.comment-form-comment { float:none; padding:0; margin:10px 0 0; position:inherit; width:100%; }
p.comment-form-comment textarea { min-height:150px; width:100%; max-width:100%; min-width:100%; }
#comments input[type="submit"] { color:#fff; -webkit-appearance:none; border:none; text-align:center; position:absolute; bottom:0; right:0; z-index:1; margin:0; padding:0; width:100px; height:100px; line-height:1em; width:100px; height:100px;   border-radius:50px; }
#comments p.logged-in-as + p + p.form-submit input[type="submit"] { position:static; width:100%; height:auto; bottom:auto; right:auto; display:block; padding:8px; margin-top:10px;   border-radius:2px; }
.comment-form .comment-ajax { margin:5px 0; }
.comment-form .comment-ajax > div { padding:5px 10px; font-size:16px; }
.comment-form .ajax-error { background:#356; color:#fff; }
.comment-form .ajax-success { background:#2bb; color:#fff; } 
.comment-form .ajax-processing { position:relative; background:#eee; } 
.comment-form .ajax-processing::before { width:100%; display:block; content:' '; margin:0; padding:0; background:#a9e3e4; position:absolute; height:3px; left:0; bottom:0; -moz-animation:fullexpand 1.5s ease-out; -webkit-animation:fullexpand 1.5s ease-out; z-index:1; }
@-moz-keyframes fullexpand { 0% { width:0; } 100%{ width:100%; } }
@-webkit-keyframes fullexpand { 0%  { width:0; } 100%{ width:100%; } }
#reply-box { margin:0 10px 10px 35px; background:#f9f8f5; padding:5px 10px 10px; }
#reply-box .comment-form { padding:0 0 140px; position:relative; }
body.logged-in #reply-box .comment-form { padding:0; }
#reply-box::after { display:block; content:' '; clear:both; }
#reply-commentform { }
@media screen and (max-width:980px){
  #respond, body.logged-in #respond { padding:0; }
  p.comment-form-author, p.comment-form-email, p.comment-form-url, p.comment-form-captcha { position:static; width:100%; max-width:100%; margin-top:5px; }
  p.form-submit { margin-top:10px; }
  #reply-box .comment-form { padding:0; }
  #comments input[type="submit"] { width:100%; position:static; height:auto; padding:12px 15px; font-size:16px; line-height:1em;   border-radius:2px; }

}
