/*
Theme Name: Yumi Asakura
Theme URI: http://yumiasakura.com
Description: 朝倉由美サイトのテーマ
Version: 1
Author: Yumi Asakura
Author URI: http://yumiasakura.com
*/


/****************************************
		Base
*****************************************/
html {margin:0; padding:0;}
body { margin:0; padding:0;
background-color:#d8e6e6;
font-family: 'ヒラギノ角ゴ Pro W3','HiraKakuPro-W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック', sans-serif;
color:#7E8387; font-size:9pt; line-height:1.8; letter-spacing:0.07em;
}
a {color:#d98b89; text-decoration:none;}
a:hover {color:#55585C; }
.clear {clear:both;}

a img {border:none;}

h1.title2 a {width:300px; height:300px; background:url(img/title.jpg) top left no-repeat;
text-indent:-9999px; display:block; overflow:hidden; margin:0 0 10px 0; padding:0;}
h1.title2 a:hover {background:url(img/title_o.jpg) top left no-repeat;}
h1.site-title {visibility: hidden; height:0px;}

#contents {width:1200px; height:auto; margin:0 auto 50px auto; padding:0; background-color:#d8e6e6; }

/****************************************
		Side
*****************************************/
nav {width:300px; height:auto; float:left; margin:0 0 70px 40px; padding:0;}
nav h1.title a {width:300px; height:300px; background:url(img/title.jpg) top left no-repeat;
text-indent:-9999px; display:block; overflow:hidden; margin:0 0 10px 0; padding:0;}
nav h1.title a:hover {background:url(img/title_o.jpg) top left no-repeat;}

nav ul {width:300px; height:240px; margin-left:50px; background:url(img/nav_bg.jpg) bottom left no-repeat; position:relative;}

li.nav_about a {width:200px; height:46px;background:url(img/nav_about.jpg) top left no-repeat; position:absolute; top:0; left:0;
text-indent:-9999px; display:block; overflow:hidden;}
li.nav_about a:hover {background:url(img/nav_about_o.jpg) top left no-repeat;}
li.nav_works a {width:200px; height:33px;background:url(img/nav_works.jpg) top left no-repeat; position:absolute; top:46px; left:0;
text-indent:-9999px; display:block; overflow:hidden;}
li.nav_works a:hover {height:50px; background:url(img/nav_works_o.png) top left no-repeat; margin-top:-8px; z-index:2;}
li.nav_wb a {width:200px; height:32px;background:url(img/nav_wb.jpg) top left no-repeat; position:absolute; top:78px; left:0;
text-indent:-9999px; display:block; overflow:hidden;}
li.nav_wb a:hover {background:url(img/nav_wb_o.jpg) top left no-repeat; z-index:2;}
li.nav_contact a {width:200px; height:39px;background:url(img/nav_contact.jpg) top left no-repeat; position:absolute; top:79px; left:0;
text-indent:-9999px; display:block; overflow:hidden;}
li.nav_contact a:hover {background:url(img/nav_contact_o.png) top left no-repeat; z-index:2;}
li.nav_fav a {width:200px; height:52px;background:url(img/nav_fav.jpg) top left no-repeat; position:absolute; top:118px; left:0;
text-indent:-9999px; display:block; overflow:hidden;}
li.nav_fav a:hover {width:223px; height:60px; background:url(img/nav_fav_o.png) top left no-repeat; margin-top:-2px; margin-left:-25px; z-index:2;}

/** fav-log用sidebar **/
nav.log ul {width:300px; height:177px; margin-left:50px; position:relative; background:none;}
nav.log ul li {margin:7px 0; }
nav.log li.nav_fav a {width:223px; height:60px; background:url(img/nav_fav_o.png) top left no-repeat; margin-top:-2px; margin-left:-25px; z-index:2;}
nav.log section {width:200px; margin-left:50px; background:url(img/log_kako.jpg) top left no-repeat; padding-top:55px;  font-size:90%;}
nav.log section h2 {width:150px; height:auto; padding:5px 80px 10px 30px; font-weight:normal;}
nav.log section article {width:150px;  padding:10px; margin:10px auto 10px 10px; }
nav.log section article h3 {font-family: 'Lobster Two', cursive; font-size:140%; color:#E7B9B9; background:url(img/line2.gif) bottom repeat-x; padding-bottom:7px;}
nav.log section ul {height:auto; position:static; margin:0; width:150px; line-height:1.5;}
nav.log section ul li {padding:5px 0 7px 0; border-bottom:1px dotted #a4acb3;}
nav.log section ul a {color:#6C7074;}
nav.log section ul a:hover { color:#E99896;}
/** archives **/
nav.log section ul.archives {font-family: 'Copse', serif; }
nav.log section ul.archives strong {display:block; font-weight:normal;}
nav.log section ul.archives a {margin-right:3px; font-size:110%;}
nav.log section ul.archives .emptymonth {color:#a8bebe;margin-right:3px;}
/** popular **/
nav.log section article h3.popular {background:none; padding:0;}
nav.log section ul.pop li {width:130px; height:138px; position:relative; border:none;padding:5px; margin:0 0 10px 5px; } 
nav.log section ul.pop li img {width:120px; height:127px; } 
nav.log section ul.pop li div.mask {width:130px; height:138px; position:absolute; top:0; left:0;
background:url(img/mask_giza.png) top left no-repeat;  z-index:100; } 
nav.log section ul.pop li a div.mask:hover {background:url(img/mask_giza_on.png) top left no-repeat}
nav.log section ul.pop li a span {width:130px; font-size:110%;  font-family: 'Copse', serif; 
position:absolute; top:125px; left:0; z-index:101; text-align:center;}
nav.log section ul.pop li a:hover { color:#E7B9B9;}
/** search **/
form#search {width:150px; background:url(img/search.png) right top no-repeat; margin-left:15px;}
form#search input.s_box {width:120px; padding:5px; margin:7px 0 0 10px; border:none; background-color:transparent;}
form#search input.s_submit {color:#7E8387; font-family: 'Copse', serif;  letter-spacing:0.1em;
margin:30px 0 0 80px; padding:4px 10px; border:none; background-color:#ecf6f7; cursor:pointer;
border-radius: 3px;
-webkit-border-radius: 3px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 3px;   /* Firefox用 */  
}
form#search input.s_submit:hover {background-color:#fff;}

nav.log section article h3.gmap {background:none;}

/** works用sidebar **/
nav.nav_works ul {width:300px; height:auto; margin-left:50px; position:relative; background:none;}
nav.nav_works li.nav_about a {z-index:2;}
nav.nav_works li.nav_works a {width:200px; height:50px; background:url(img/nav_works_o.png) top left no-repeat; text-indent:-9999px; display:block; overflow:hidden; margin-top:-8px; z-index:2;}
nav.nav_works ul.workscat {width:200px; height:240px; margin:0;  padding:90px 0 0 0; z-index:0;}
ul.workscat li {padding-left:20px;font-family:'Lobster Two', cursive;font-size:180%;}
ul.workscat li h3 {width:200px; height:55px; margin-left:-30px;background:url(img/log_kako.jpg) top left no-repeat; text-indent:-9999px; }
nav.nav_works li.nav_wb a {top:245px; left:0;}
nav.nav_works li.nav_contact a {top:245px; left:0;}
nav.nav_works li.nav_fav a {top:280px; left:0;}
/** works recent post **/
nav.nav_works ul.recent_works {width:120px; padding:10px 10px 10px 10px;  margin:40px auto 0 65px; background:url(img/line2.gif) top repeat-x; font-size:90%; }
li.recent_works_title {font-family: 'Lobster Two', cursive; font-weight:bold; font-size:120%; color:#E7B9B9;}
ul.recent_works li {margin-bottom:10px;}
ul.recent_works li a {color:#6C7074;}
ul.recent_works li a:hover { color:#E99896;}


/****************************************
		Main
*****************************************/
#main {width:700px; height:auto; float:left; margin:120px 80px 20px 80px; }

/** Top **/


/****************************************
		About
*****************************************/
.about {}
.about h1 {font-size:120%; margin:40px 0 20px 0;}
.about p {margin-bottom:15px;}
.about p.min {margin:25px 0; font-family:"ヒラギノ明朝 Pro W3","Hiragino Mincho Pro", "Times New Roman", serif;}

/****************************************
		Works
*****************************************/
#main_w {width:700px; height:auto; float:left; margin:120px 0 20px 50px;  font-family:"ヒラギノ明朝 Pro W3","Hiragino Mincho Pro", "Times New Roman", serif;}
#main_w .post {clear:both; padding-bottom:50px;}
h1.works_title {width:580px; padding:0 0 7px 0;border-bottom:1px dotted #bbb; margin-bottom:15px;}
#main_w h2.works-title {width:580px; height:auto; color:#7E8387; background:none; font-size:12pt; margin:0; padding:0; border:none;}
#main_w h2.works-title a {color:#7E8387;} #main_w h2.works-title a:hover {color:#d98b89;}
#main_w .post img {max-width:580px; height:420px; margin-top:0px;
border-radius: 5px;  -webkit-border-radius: 5px; -moz-border-radius: 5px;}
#main_w .post img.wp_social_bookmarking_light_img {max-width:16px; height:16px;}
#main_w p {margin:10px 0 20px 0;}
p.spec {width:auto; height:auto; padding:10px 10px 5px 0; margin:0; font-size:90%; }
p span.cat {font-size:120%; padding-left:15px; font-family: 'Lobster Two', cursive; letter-spacing:1.5px;}
#main_w p.text { width:560px; padding:20px 10px 0 10px;  margin:0; background:url(img/line2.gif) top repeat-x; }

ul.charge {margin:15px 0 80px 0; }
ul.charge li {width:auto; height:auto; float:left; margin-right:7px; margin-bottom:7px; padding:2px 5px; border:1px solid #fff;
font-size:90%;  font-family: 'ヒラギノ角ゴ Pro W3','HiraKakuPro-W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック', sans-serif;
border-radius: 3px;
-webkit-border-radius: 3px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 3px;   /* Firefox用 */  
/** for IE **/
behavior: url(js/PIE.htc);
}
.toolTip {position: relative; color:#A6B5B6;}
.toolTip span {color:#55585C; display: block; border: #bbb; background-color: #fff; position: absolute; top:30px;  left: 0; padding: 5px;   visibility: hidden; width:200%;}
a.toolTip:hover,a.toolTip:hover span{ visibility: visible; z-index: 100;}  
li.design {background:#F0E8E6; }
li.web {background:#E7F0F0;}
li.counseling {background:#E7FFDE; }
li.photo {background:#f0eee6; }
li.design:hover, li.web:hover, li.photo:hover {background:#fff;}


/****************************************
		Post
*****************************************/

.post {margin:0 0 20px 0; padding-bottom:50px; font-family:"ヒラギノ明朝 Pro W3","Hiragino Mincho Pro", "Times New Roman", serif;}
h1.post-title {width:700px; height:80px; padding:17px 0 0 30px; background:url(img/cloud.jpg) top left no-repeat; margin-left:-15px; }
h1.post-title a {color:#7E8387; font-size:120%; }
h1.post-title a:hover {color:#55585C; }
.post { color:#4e5558; font-size:9pt; line-height:2;}
p.day_cat {margin:-30px 0 10px 110px; font-family: 'Lobster Two', cursive; letter-spacing:1.5px;}
.day {margin-right:10px;} 
#main p.day_cat .cat {font-size:90%;}
.pibfi_pinterest {margin:0 0 -20px 0;}
.post p {margin:10px 0;}

.post h2 {width:700px; border-top:1px dotted #fff; padding:10px 0 0 0; margin-top:35px; font-size:120%;}
.post p.line {width:700px; border-bottom:1px dashed #fff; padding-bottom:15px;}
.post h3 {width:100%; background:#ecf6f7; padding:12px 15px; font-size:120%; margin-top:50px;
border-radius: 3px;-webkit-border-radius: 3px; -moz-border-radius:3px;}

.post blockquote p{ font-style:italic; padding:0 5px;}
.post blockquote p:before {content: url(img/blockquote1.png) top left no-repeat;}
.post blockquote p:after {content: url(img/blockquote2.png) top right no-repeat;}


/** CATEGORY LIST **/
.cat_title {font-size:140%; font-family: 'Lobster Two', cursive; letter-spacing:1.5px;
width:580px; padding:0 0 15px 0;}
.posts {    width: 140px;
    height: auto;
    display: inline-block;
    margin: 0 10px 0 0;
    padding: 0 0 50px 0;
    vertical-align: top;}
.posts a img {width:100%; height:auto; border:1px solid #eaedf3; }
.posts a img:hover {filter:alpha(opacity=50);/*for IE*/  -moz-opacity: 0.5;/*for Firefox*/  opacity: 0.5;}
.posts h1 { font-size:80%; font-weight:normal;}
.posts p.day_cat {margin:0; font-size:80%; }

.post_list {margin:20px 0; font-family:"ヒラギノ明朝 Pro W3","Hiragino Mincho Pro", "Times New Roman", serif;}
.arc_title {font-size:120%; font-family: 'Lobster Two', cursive; letter-spacing:1.5px;
width:580px; padding:0 0 15px 0;}

/** for IE **/
.post img {width: expression(document.body.clientWidth < 502? "600px" : document.body.clientWidth > 502? "600px" : "auto");}

.post p img {width:700px; height:auto; border:1px solid #eaedf3; margin:20px 0 0 0;}

.nav-below {margin:0 0 70px 0; text-align:right; font-size:120%; font-family: 'Copse', "ヒラギノ明朝 Pro W3","Hiragino Mincho Pro",serif; 
padding:7px 0 0 0; background:url(img/line.gif) top left repeat-x;}
.nav-below span.nav-next {width:auto; float:left; display:block;}
.nav-below span.nav-prev {width:auto; float:right; display:block;}
.nav-below a {color:#7E8387;} .nav-below a:hover {color:#E99896;}

.ajax-entry-more-link {text-align:right; font-family: 'Copse', serif; font-size:160%; margin:0;}

/** comment **/
.post_com {clear:both; font-family: 'Lobster Two', "ヒラギノ明朝 Pro W3","Hiragino Mincho Pro", cursive; letter-spacing:1.5px;}
h2#comments {font-weight:normal;}
.comment-author {width:auto; float:left; margin-right:20px; margin-bottom:10px;}
.comment-meta {width:auto; float:left; padding-top:2px;}
.commentlist p {clear:both;}
.comment-author img {display:none;}
.says {font-size:80%;}
.comment-meta, .reply {font-size:80%;}
#respond h2 {width:600px; height:50px; text-indent:-9999px; background:url(img/comment.png) top left no-repeat; border:none;}
.commentlist li {background:#E7F0F0; border:1px solid #fff;
width:auto; height:auto; padding:10px 15px; margin:10px 0;
border-radius: 5px;
-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 5px;   /* Firefox用 */  
/** for IE **/
behavior: url(js/PIE.htc);
}

#respond {margin-top:20px;}
#respond #author,#respond #email,#respond #url,#respond #comment 
{background:#E7F0F0;border:1px solid #fff;
border-radius: 5px;
-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 5px;   /* Firefox用 */  
/** for IE **/
behavior: url(js/PIE.htc);
}
#respond input,#respond textarea {margin:5px 0 !important; padding:3px;}
td.label {width:120px; text-align:right; padding-right:5px;}
.com-box {margin-left:125px;}
#respond label .attention {font-size:80%; color:#ed6d34; margin-left:5px;}	
#respond #submit {width:107px; height:58px; background:url(img/soushin.png) top left no-repeat;
border:none; padding-top:15px; font-family:"ヒラギノ明朝 Pro W3","Hiragino Mincho Pro", serif; letter-spacing:2px; cursor:pointer; }
#respond #submit:hover {background-position:0 5px; padding-top:21px;}

/** amazon **/
.amazlet-box {width:300px; float:left; margin:30px 0 0 0; padding:20px 50px 30px 0; border-top:1px dashed #fff; 
font-family:sans-serif; font-size:80%;}
.amazlet-name {font-size:120%;}


/** SNS **/
.social {margin:20px 0; font-size:200%; clear:both; border-top:1px dashed #fff; padding-top:20px;}
.social li {display:inline-block; }
.social li a {color:#7E8387;}
/** 注意 **/
.social .caution {font-family:sans-serif; font-size: 45%;}

/** Similar posts **/
.similar h4 {font-size:140%; font-family: 'Lobster Two', cursive; font-weight:normal; margin-bottom:5px;}
.similar {margin:30px 0 40px 0;}
.similar ul li {    width: 15%;
    height: auto;
    display: inline-block;
    margin-right: 1%;
    vertical-align: top;}
.similar ul li a {color:#7E8387;}
.similar ul li a img {width:100%; height:auto!important; border:1px solid #eaedf3; /** -webkit-mask-image:url(img/mask.png); **/ }
.similar ul li a img:hover {filter:alpha(opacity=50);/*for IE*/  -moz-opacity: 0.5;/*for Firefox*/  opacity: 0.5;}
.similar ul li h5 {font-size:80%; font-weight:normal;}


/****************************************
		Contact
*****************************************/
form.wpcf7-form {width:777px; height:500px; margin:30px auto; padding:0; position:relative; }
#contact {width:777px; height:500px; background:url(img/postcard.jpg) top center no-repeat; margin:0 auto; padding:0; }
.info {color:#78756f; width:300px; height:auto; position:absolute; top:95px; left:51px;}
.caption {font-size:80%;}
.message {width:300px; height:200px; float:left; position:absolute; top:210px; left:51px;}
.message textarea {color:#d98b89; width:290px; height:200px; padding:7px 10px; border:none; background:transparent;}
.address {width:210px; height:auto; float:left; position:absolute; top:210px; left:420px; font-size:110%;}
.address input {width:210px; height:30px; padding:0 10px; border:none; background:transparent; margin-bottom:30px;}
.name, .mail, test_r { position:relative; }
.test_l {width:100px; height:30px; float:left; }
.test_r {width:80px; height:30px; float:left; margin-left:20px; margin-top:-3px;}
.test_r input {width:80px; height:30px; }
.submit {width:221px; height:41px; margin-top:60px;}
.submit input {width:221px; height:41px; border:none; background:url(img/submit.jpg) top left no-repeat; text-indent:-9999px;
display:block; overflow:hidden; cursor:pointer;}
.submit input:hover {background-position:0 -41px;}
/** error : hubi **/
div.wpcf7-response-output {position:absolute; top:420px; left:51px; margin:0!important; padding:0!important; color:#e62e8b;}
div.wpcf7-validation-errors {width:300px; border: none!important;}
span.wpcf7-not-valid-tip {padding:10px; background:#fff; opacity:.7; color:#e62e8b!important;}
/** error : other **/
.wpcf7-not-valid-tip-no-ajax {width:119px; height:auto; position:absolute; top:-20px; left:102%; font-size:90%!important; }
/** ok **/
.wpcf7-mail-sent-ok {border:none!important;}
/****************************************
		welcomeboard Contact
*****************************************/
body.w_contact_body {background-color:#fff;}
#w_contact .info {color:#78756f; width:270px; height:auto; position:absolute; top:65px; left:51px;}
#w_contact {width:777px; height:500px; background:url(http://welcomeboard.yumiasakura.com/img/pc.jpg) top center no-repeat; margin:0 auto; padding:0; }
#w_contact .message {width:350px; height:200px; float:left; position:absolute; top:210px; left:53px;}
#w_contact .message textarea {width:340px; height:190px; padding:5px; border:none; background:transparent;}
#w_contact .address {width:210px; height:auto; float:left; position:absolute; top:210px; left:470px; font-size:110%;}
#w_contact .test_r {width:80px; height:30px; float:left; margin-left:20px; margin-top:-3px;}
#w_contact .test_r input {width:80px; height:30px; }
#w_contact .submit input {width:221px; height:41px; border:none; background:url(img/submit.jpg) top left no-repeat; text-indent:-9999px;
display:block; overflow:hidden; cursor:pointer; opacity:0.7;}
#w_contact .submit input:hover {background-position:0 -41px; opacity:1;}


/****************************************
		photo
*****************************************/
.photo .post a img {width:200px; border:1px solid #fff; margin:auto 10px 10px auto;}
.photo .post a img:hover {border:1px solid #bbb;}

 .photo .post a.tate img  {width:88px; height:133px;}


/****************************************
		Footer
*****************************************/
.f_top {width:100%; height:53px; background:url(img/kami.jpg) repeat-x; clear:both; text-indent:-9999px;}
footer {width:auto; font-size:90%; background:url(img/kami2.jpg) repeat; position:relative; margin:0 auto; padding-bottom:50px; }
footer section {width:1100px; height:auto; margin:0 auto; padding-left:100px;}
footer article h2 {font-family: 'Copse', serif; font-size:10pt; letter-spacing:1px; color:#A6B5B6;
text-shadow:-1px -1px 1px rgba(0, 0, 0, 0.4),1px 1px 1px rgba(255, 255, 255, 0.5);
padding:10px;
/** for IE **/
behavior: url(js/PIE.htc);}
article.aboutme {width:270px; height:auto; margin-right:20px; margin-bottom:30px; float:left;}
article.aboutme h2 {width:250px; background:url(img/line.gif) bottom repeat-x; margin-bottom:20px;}
article.aboutme p {padding:0 10px;}
article.aboutme a {font-family: 'Lobster Two', cursive; font-size:120%;}

article.recent, article.account, article.sitemap  {width:auto; height:auto;  margin-right:20px;  float:left;}
article.recent {max-width:200px;}
article.recent h2, article.account h2, article.sitemap h2 {
width:auto; background:url(img/line.gif) bottom repeat-x; margin-bottom:20px; }
article.account ul, section.sitemap ul {padding:0 10px;}
article.recent table {margin:0 10px; font-family: 'Copse' sans-serif;}
article.recent th { padding-right:15px; padding-bottom:8px; font-weight:normal;}
article.recent td {padding-bottom:8px; }
article.recent td a { color:#7E8387; padding-bottom:3px; border-bottom:1px dotted #95A2A4;}
article.recent td a:hover {color:#55585C; border:none;}

article.sitemap ul {margin-left:20px;}
article.sitemap li {margin:bottom:8px; list-style-image:url(img/dots.png);}
article.sitemap li a {color:#7E8387;}
article.sitemap li a:hover {color:#55585C;}

article.account li {width:auto; height:25px; margin-bottom:5px; font-family: 'Copse' sans-serif; }
article.account li a { height:25px; padding-left:32px; display:block; color:#7E8387;}
li.twitter a {background:url(img/twitter.png) top left no-repeat;}
li.pin a {background:url(img/pin.png) top left no-repeat;}
li.fb a {background:url(img/fb.png) top left no-repeat; }
li.insta a {background:url(img/instagram.png) top left no-repeat; }
li.twitter a:hover, li.pin a:hover, li.fb a:hover, li.insta a:hover {background-position:0 -25px; color:#55585C;}

article.totop {width:80px; height:115px; clear:both; position:fixed; bottom:0; right:0;}
article.totop a {width:80px; height:115px; background:url(img/totop.png) bottom right no-repeat;
text-indent:-9999px; display:block; overflow:hidden;}
article.totop a:hover {background:url(img/totop_o.png) bottom right no-repeat;}

.copy { clear:both; font-size:85%; letter-spacing:0.1em;}