@import url(http://weloveiconfonts.com/api/?family=typicons|zocial);
*{border:0;margin:0;outline:0;padding:0;box-sizing:border-box;font:inherit;font-style:normal;font-weight:lighter;list-style:none;text-decoration:none;}
html{width:100%;height:100%;}
article,aside,dialog,figure,footer,header,main,menu,nav,section{display:block;}
audio,canvas,video{display:inline-block;}
br,hr{display:block;}
ol,ul{list-style:none;}
table{border-collapse:collapse;border-spacing:0;}
body{font-size:13px;line-height:1;width:100%;font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;}
.cf:before,.cf:after{display:table;content:'';}
.cf:after{clear:both;}
a{color:#333;}
a:hover{color:#cc3467;text-decoration:underline;}
img{max-width:100%;height:auto;}
.body{background-color:#fff;}
.cf:before,.cf:after{content:"";display:table;}
.cf:after{clear:both;}
.cf{zoom:1;}
.sh_fc2blogheadbar{display:none;!important}
body{background-color:#f0f3f5;position:relative;word-break:break-all;}

/* ==========================================================================
     font
========================================================================== */
[class*="typicons-"]:before{font-family:'Typicons',sans-serif;line-height:1;}
[class*="zocial-"]:before{font-family:'zocial',sans-serif;line-height:1;}

/* ==========================================================================
     common
========================================================================== */
.d-ib{display:inline-block;*display:inline;*zoom:1;}
.hidden{display:none;}
.blog_header{border-top:2px solid #cc3467;box-shadow:0 0 5px 0 rgba(0,0,0,0.7);background-color:#FFF;}
.inner{margin:0 auto;position:relative;width:1050px;}
.blog_name{height:110px;width:230px;}
.blog_name a{background:url("https://blog-imgs-73.fc2.com/d/e/v/developblogs/logo.png") no-repeat scroll 0 center transparent;display:block;height:110px;overflow:hidden;text-indent:100%;white-space:nowrap;width:230px;}
.blog_nav{background-color:#cc3467;font-size:0;}
.blog_nav li a{font-size:13px;border-right:1px solid #a32a52;color:#fff;display:block;line-height:40px;text-align:center;width:100px;}
.blog_nav li a:hover{background-color:#a32a52;text-decoration:none;}
.blog_nav li:first-child{border-left:1px solid #a32a52;}
.blog_container{padding-top:12px;}
.blog_main{float:right;width:780px;}
.blog-sidebar{float:left;text-align:center;width:250px;}
.blog_nav .nav_icon{float:right;}
.blog_nav .nav_icon a{background-color:#fff;border-radius:3px;color:#e15785;display:block;font-size:16px;height:30px;line-height:30px;margin-left:8px;margin-top:5px;text-align:center;width:30px;}
.blog_nav .nav_icon a:hover{background-color:#a32a52;text-decoration:none;color:#FFF;}
.permanent_text{padding:20px}
.permanent_more{padding:20px}
.permanent_text a img,.permanent_more a img{background-color:#f7f7f7;border:1px solid #dfdfdf;box-sizing:content-box;display:block;margin:0 auto;padding:5px;}
.search_text{background-color:#fee9f0;border:1px solid #fec9db;border-radius:3px;color:#cc3467;font-size:15px;margin-bottom:10px;padding:10px;text-align:center;}
.search_text span{color:#111;font-size:16px;font-weight:bold;margin:0 10px;}

/* ==========================================================================
     topentry
========================================================================== */
.topentry {display: inline-block;overflow: hidden;padding: 0 5px 10px;position: relative;width: 387px;vertical-align: top;}
.topentry_inner{background-color:#fff;border-bottom:2px solid #cc3467;border-radius:5px;box-shadow:0 1px 3px rgba(0,0,0,0.2);overflow:hidden;}
.topentry_img{display:block;height:200px;overflow:hidden;}
.topentry_img img{margin-top:-10%;min-width: 377px;}
.topentry_about{padding:12px;}
.topentry_title a{border-bottom:1px solid #ddd;color:#111;display:block;font-size:17px;font-weight:bold;line-height:1.2;margin-bottom:10px;padding-bottom:10px;}
.topentry_title a:hover{color:#cc3467;}
.topentry_date{color:#777;display:block;font-size:12px;margin-bottom:8px;}
.topentry_comment a{background-color:#fff;border-radius:3px;color:#cc3467;left:15px;padding:6px 0 3px;position:absolute;text-align:center;top:8px;width:60px;}
.topentry_comment a:hover{background-color:#cc3467;color:#FFF;text-decoration:none;}
.topentry_comment span{font-size:18px;overflow:hidden;vertical-align:sub;}
.topentry_tag {font-size:0}
.topentry_tag a{  margin: 2px 2px 2px 2px;border:1px solid #fec7d9;border-radius:3px;color:#e15785;font-size:12px;padding:3px 8px 0;}
.topentry_tag a span{font-size:14px;vertical-align:sub;}
.topentry_tag a:hover{border-color:#e15785;background-color:#e15785;color:#FFF;text-decoration:none;}
.pn-page{clear:both;text-align:center;}
.pn-page li{display:inline-block;*display:inline;*zoom:1;}
.pn-page .page-link{background-color:#cc3467;border-radius:3px;color:#fff;display:block;margin:10px 5px;padding:10px 12px;}
.pn-page .page-link:hover{background-color:#a32a52;text-decoration:none;}
.pn-page .current{background-color:#ffffff;border-left:1px solid #ccc;border-radius:3px;border-top:1px solid #ccc;color:#989898;display:block;margin:10px 5px;padding:10px 12px;}

/* ==========================================================================
     side
========================================================================== */
.plg_area{background-color:#fff;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.2);margin-bottom:10px;padding:3px;}
.plg_title{background-color:#fee9f0;border:1px solid #fec9db;border-radius:3px 3px 0 0;color:#cc3467;font-weight:bold;padding:10px;}
.plg_body{padding:10px;}
.plg_body li a{text-align:left;line-height:1.2;display:block;padding:8px 20px 8px 0;border-top:1px solid #ddd;color:#333;position:relative;}
.plg_body li a:hover{color:#cc3467;}
.plg_body li:first-child a{border-top:none;}
.plg_body li a:after{border-radius:2px;border-right:2px solid #ccc;border-top:2px solid #ccc;content:"";height:8px;margin:0 0 0 10px;position:absolute;right:8px;top:11px;transform:rotate(45deg);width:8px;}
.plg_body .img-li li a{margin:0 auto;padding:5px 0;text-align:center;}
.plg_body .img-li li a img{border:1px solid #ccc;margin-top:2px;padding:3px;}
.plg_body .img-li li a:hover img{background-color:#cc3467;border:1px solid #cc3467;}
.plg_body .img-li li a:after{display:none;}
.plugin-search{position:relative;}
.plugin-search input[type="text"]{border:1px solid #ccc;border-radius:3px;padding:0 45px 0 6px;width:100%;height: 34px;line-height: 34px;}
.plugin-search input[type="submit"]{height: 34px;background-color:#cc3467;border-radius:0 3px 3px 0;color:#fff;cursor:pointer;line-height:34px;padding:0 6px;position:absolute;right:0;top:0;}

/* ==========================================================================
     common
========================================================================== */
.separate_ribbon{background:none repeat scroll 0 0 #f7f7f7;border:1px solid #c6c6c6;border-radius:3px 3px 0 0;clear:both;color:#3a3a3a;font-weight:bold;margin:0 -7px 0 2px;padding:10px 15px;position:relative;text-transform:uppercase;}
.separate_ribbon:after{border-bottom:8px solid transparent;border-left:8px solid #525252;bottom:-8px;content:"";display:block;height:0;position:absolute;right:-12px;width:10px;}

/* ==========================================================================
     permanent
========================================================================== */
.permanent_area{background-color:#fff;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.2);margin-bottom:10px;}
.permanent_header{padding:20px;}
.permanent_title a{border-left:5px solid #cc3467;color:#333;display:block;font-size:24px;font-weight:bold;line-height:1.2;margin-left:-20px;padding-left:12px;}
.breadcrumb{margin-bottom:20px;}
.breadcrumb span{color:#777;}
.breadcrumb a:hover span{color:#cc3467;}
.breadcrumb .breadcrumb_title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:500px;}
.social_btn{background-color:#f7f7f7;border-bottom:1px solid #dfdfdf;border-top:1px solid #dfdfdf;margin-bottom:15px;padding:10px 0;text-align:center;}
.social_btn li{vertical-align:top;}
.social_btn a{border-bottom:2px solid rgba(0,0,0,0.3);border-radius:3px;color:#fff;display:block;height:30px;line-height:30px;margin:0 5px;width:100px;}
.social_btn a:hover{border-bottom:none;border-top:2px solid rgba(0,0,0,0);text-decoration:none;}
.social_hatena a{background-color:#1362AC;font-size:18px;font-weight:bold;}
.social_fbook a{background-color:#344E86;font-size:16px;}
.social_twitter a{background-color:#00aef1;font-size:16px;}
.social_feedly a{background-color:#8FC137;font-size:16px;}
.social_pocket a{background-color:#ea4654;font-size:16px;}
.permanent_date{color:#777;margin-bottom:20px;text-align:right;}
.permanent_date li{margin-right:10px;}
.permanent_date li a{border:1px solid #fec7d9;border-radius:3px;color:#e15785;font-size:12px;padding:3px 8px 0;}
.permanent_date li a span{font-size:14px;vertical-align:sub;}
.permanent_date li a:hover{background-color:#e15785;border-color:#e15785;color:#fff;text-decoration:none;}
.separate_title{background-color:#f7f7f7;border-bottom:1px solid #dfdfdf;border-top:1px solid #dfdfdf;font-size:16px;font-weight:bold;padding:12px 20px;}
.relate_ul{padding-left:28px;}
.relate_li{color:#ccc;list-style:outside none disc;padding:12px 10px 12px 0;position:relative;}
.relate_li a{display:block;font-size:15px;padding-right:140px;}
.relate_li:before{border-top:1px dotted #ddd;content:"";left:-18px;position:absolute;top:0;width:100%;}
.relate_li:first-child:before{border-top:none;}
.relate_li span{display:block;font-size:12px;position:absolute;right:15px;top:12px;}
.permanent_nav{position:relative;}
.permanent_nav_prev,.permanent_nav_next{background-color:#fff;border:2px solid #fff;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.2);display:block;font-size:15px;line-height:1.2;margin-bottom:10px;min-height:120px;padding:10px;text-align:left;width:350px;}
.permanent_nav_prev{float:left;}
.permanent_nav_next{float:right;}
.permanent_nav_prev:before,.permanent_nav_next:before{background-color:#fee9f0;border:1px solid #fec9db;border-radius:3px 3px 0 0;color:#cc3467;display:block;font-size:14px;font-weight:bold;margin:-5px -5px 10px;padding:8px 10px;text-decoration:none;}
.permanent_nav_prev:before{content:"前の記事";}
.permanent_nav_next:before{content:"次の記事";}
.permanent_nav_prev:hover,.permanent_nav_next:hover{border:2px solid #cc3467;text-decoration:none;}
.permanent_nav_home{background-color:#cc3467;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.2);color:#fff;display:block;font-size:32px;height:120px;left:360px;line-height:130px;position:absolute;text-align:center;width:60px;}
.permanent_nav_home:hover{background-color:#a32a52;text-decoration:none;color:#FFF}
.permanent_text br,.permanent_more br{margin:8px 0;}
.permanent_text b,.permanent_more b{font-weight:bold;}
.permanent_text a[target="_blank"],.permanent_more a[target="_blank"]{display:block;font-size:15px;}
.permanent_text a[target="_blank"]:before,.permanent_more a[target="_blank"]:before{}

/* ==========================================================================
     comment
========================================================================== */
.comment_area{background-color:#fff;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.2);margin-bottom:10px;overflow:hidden;}
.comment_area .typicons-user{background-color:#f7f7f7;border:1px solid #dfdfdf;color:#7d7d7d;display:block;float:left;font-size:30px;height:38px;line-height:42px;text-align:center;width:38px;}
.comment_entry{padding:16px;}
.comment_date{color:#e15785;font-size:13px;margin-top:5px;text-align:right;}
.comment_body{background:none repeat scroll 0 0 #ffffff;border:1px solid #7b7b7b;border-radius:3px;float:right;font-size:16px;line-height:1.2;padding:11px;position:relative;width:690px;}
.comment_body:after,.comment_body:before{right:100%;top:30%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none;}
.comment_body:after{border-color:rgba(255,255,255,0);border-right-color:#ffffff;border-width:10px;margin-top:-10px;}
.comment_body:before{border-color:rgba(0,0,0,0) #7B7B7B rgba(0,0,0,0) rgba(0,0,0,0);border-width:11px;margin-top:-11px;}
#comment_form{padding:20px;}
#comment_form label{display:block;margin-bottom:10px;}
#comment_form .input_text{border:1px solid #ddd;border-radius:3px;box-shadow:0 1px 3px #ddd inset;margin-bottom:15px;padding:10px;}
#comment_form #comment{border:1px solid #ddd;border-radius:3px;box-shadow:0 1px 3px #ddd inset;margin-bottom:15px;padding:10px;width:100%;}
.form_btn input{background-color:#cc3467;border-bottom:3px solid rgba(0,0,0,0.3);border-radius:3px;color:#fff;cursor:pointer;font-size:14px;line-height:35px;width:100%;}
.form_btn input:hover{border-bottom:none;border-top:3px solid #cc3467;}

/* ==========================================================================
     footer
========================================================================== */
.blog_footer{background-color:#fff;margin-top:20px;}
.page_top a{background-color:#cc3467;color:#fff;display:block;line-height:30px;text-align:center;}
.page_top a:hover{background-color:#a32a52;text-decoration:none;}
.footer_inner{margin:0 auto;position:relative;width:1050px;}
.footer_logo{height:110px;width:230px;}
.footer_logo a{background:url("https://blog-imgs-73.fc2.com/d/e/v/developblogs/logo.png") no-repeat scroll 0 center transparent;display:block;height:110px;overflow:hidden;text-indent:100%;white-space:nowrap;width:230px;}
.footer_left{float:left;width:230px;}
.footer_right{float:right;padding:20px 0 20px 30px;width:810px;}
.plugin_third_name{border-bottom:1px solid #ddd;font-size:15px;font-weight:bold;margin-bottom:5px;padding-bottom:10px;}
.plugin_third_content div div{display:inline-block;*display:inline;*zoom:1;}
.plugin_third_content a{border:1px solid #fec7d9;border-radius:3px;color:#e15785;display:block;font-size:12px;line-height:24px;margin:0 10px 10px 0;padding:0 8px;}
.plugin_third_content a:hover{background-color:#e15785;border-color:#e15785;color:#fff;text-decoration:none;}
.copyright{color:#777;font-size:13px;padding:20px;text-align:center;clear: both;}

/* ==========================================================================
     rss
========================================================================== */
.field{background-color:#fff;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.2);margin-bottom:10px;padding-top:3px;}
.rss1_wrap{overflow:hidden;padding:8px;}
.rss1_wrap iframe{height:230px;width:100%;}
.rss3_wrap{overflow:hidden;}
.rss3_inner{margin:-232px 0 0;}
.rss3_inner iframe{height:1610px;width:100%;}
.rss2_wrap{overflow:hidden;padding:0 8px;}
.rss2_inner{margin:-3030px 0 0;}
.rss2_inner iframe{height:3368px;width:100%;}
.rss4_wrap{overflow:hidden;}
.rss4_inner{margin:-1830px 0 0;}
.rss4_inner iframe{height:2930px;width:100%;}
.rss5_wrap{overflow:hidden;}
.rss5_inner{margin:-3892px 0 0;}
.rss5_inner iframe{height:4228px;width:100%;}

/* ==========================================================================
     adv
========================================================================== */
.header_adv{position:absolute;right:0;top:10px;}
.entry_adv{background-color:#fff;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,0.2);clear:both;margin-bottom:10px;padding:10px;text-align:center;}
.adv_728{height:90px;margin:0 auto;width:728px;}
.more_adv{background-color:#f7f7f7;border-bottom:1px solid #dfdfdf;border-top:1px solid #dfdfdf;margin-bottom:15px;padding:10px 0;text-align:center;}
.more_adv.nobackground{background-color:#fff;border-bottom:1px solid #fff;border-top:1px solid #fff;}
.more_adv li{margin:0 10px;}