/******************** parts css ***********************/
#hgroup { width: 100%; background-color:#F0F0F0; }
#wrap_hgroup {position: relative;}
#headline1 { margin: 0; max-width: 510px; float: left; color:#777; text-shadow: #fffff8 1px 1px 0;
line-height: 1.1;
max-height: 27px;
-webkit-line-clamp: 2;
-moz-line-clamp: 2;
-ms-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
-moz-box-orient: vertical;
-ms-box-orient: vertical;
box-orient: vertical;
display: -webkit-box;
display: -moz-box;
display: -ms-box;
display: box;
overflow: hidden;
white-space: normal;
text-overflow: ellipsis;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
#headline1 h1,#headline1 h2,#headline1 p { display: inline; margin: 0; padding: 0; font-size: 11px; font-weight: normal; text-decoration: none;}
#social-button-mini { margin-top: 7px; max-width: 250px; float: right; }
#fontnavi { margin: 0; min-width: 220px; float: right; }
ul#fontSizer { mini-height: 2.5em; float: right; display: inline-block; margin: 0.25em; clear:both; }
ul#fontSizer li { text-align: center; float: left; padding: 0.5em; line-height: 1; font-size: 12px;
background-color: transparent; color:#333; text-shadow: #fffff8 1px 1px 0;}
ul#fontSizer li#font-s, ul#fontSizer li#font-m, ul#fontSizer li#font-l{ background-color: #fff; }
ul#fontSizer li#font-s.active, ul#fontSizer li#font-m.active, ul#fontSizer li#font-l.active { background-color: #C0C6C9; color:#fff; text-shadow: #333 1px 1px 0;}
.font-s { font-size: 80%; }
.font-m { font-size: 100%; }
.font-l { font-size: 130%; }
#font-s, #font-m, #font-l { margin-left: 2px; cursor: pointer; font-weight: normal; border:solid #ccc 1px; background-color: #fff; }
@media screen and (min-width: 0px) and (max-width: 979px) {
#headline1 { float: none; padding: 2px 14px;}
#fontnavi, #social-button-mini { display: none; }
}
#headline1, #fontnavi { margin:0; paddnig: 0; height: 100%;}
.social-button.google .popn-socialbutton-count {
position: relative;
box-shadow: none !important;
}
.social-button.google .popn-socialbutton-count:after,
.social-button.google .popn-socialbutton-count:before {
border: solid transparent;
content: ' ';
width: 0;
height: 0;
left: -16px;
position: absolute;
}
.social-button.google .popn-socialbutton-count:after {
border-width: 6px;
border-right-color: #eee;
top: 5px;
left: -11px;
}
.social-button.google .popn-socialbutton-count:before {
border-width: 8px;
border-right-color: #888;
top: 3px;
}
.social-button.google a.popn-socialbutton-count:hover:after {
border-right-color: #ddd;
}
#headerarea { width: 100%; margin: 0; padding: 0 0 14px; }
#headerlogo { display: table-cell; margin: 0; vertical-align: bottom; height: 100%; width: 40%; }
#headerinfo { display: table-cell; margin: 0; vertical-align: bottom; height: 100%; text-align: right; }
#headersubtext { display: table-cell; margin: 0; vertical-align: bottom; height: 100%; text-align: right; font-size: 18px;}
span#logoImg img { display: inline-block; margin-right: 7px; }
span#logoTitle { padding: 0; font-size: 23px; color: #51565b; display: inline-block; }
#headerinfo { text-align: right; }
#head_access {
color: #333;
overflow: hidden;
}
#head_access li {
font-size: 13px;
float: right;
line-height: 1.2;
vertical-align: bottom;
}
.head_contact_btn {
padding: 3px 0;
display: block;
background: none repeat scroll 0% 0% #C00;
color: #FFF;
font-weight: bold;
text-align: center;
width: 186px;
margin-left: 20px;
}
.head_contact_btn a, .head_contact_btn a:visited { color: #fff; }
.head_list a, .head_list a:visited { color: #51565b; }
.head_list {
background: url('https://www.alphanet.co.jp/images/listmark_foot.png') no-repeat scroll left 9px transparent;
padding-left: 13px;
padding-top: 5px;
margin-left: 15px;
}
#searchbox,
#alpha_search,
#google_search { margin: 5px auto; float: none; width: 95%; text-align: right; }
#searchbox {
float: right;
overflow: hidden;
margin-top: 20px;
}
#alpha_search,
#google_search {
position: relative;
float: right;
margin-left: 20px;
overflow: hidden;
}
#searchbox input { margin-bottom: 5px; }
input.google_btn,
input.fs-btn.fs-submit {
margin: 0 5px;
width:30px;
height:30px;
font-size: 30px;
font-size: 5px;
background-color: transparent;
border: none;
color: #f8f8f8;
}
#google_search:after,
#alpha_search:after {
font-family: WebHostingHub-Glyphs;
font-weight: normal;
font-style: normal;
position: absolute;
bottom: 0;
right: 0;
content:'\f69a';
font-size: 1em;
color: #ddd;
font-size: 30px;
}
@media screen and (min-width: 0px) and (max-width: 320px) {
#logoTitle  { width: 100%; display: block; margin-top: 14px; font-size: 23px; float:none; text-align: center; }
#head_access { margin: 14px 0;}
#head_access li { margin-right: 21px; }
#headerinfo p { font-size: 18px;}
#headerinfo ul li {font-size: 18px;}
#headerlogo, #headerinfo, #headersubtext {width: 100%;float:none;  display: inline-block; margin: 0; padding:0;}
#logoImg { width: 100%; display: inline-block; float:none; text-align: center; }
li.head_list { display: none; }
#searchbox,
#alpha_search,
#google_search { margin: 5px auto; float: none; width: 95%; text-align: right; }
#headerlogo { padding-top: 14px; }
}
@media screen and (min-width: 321px) and (max-width: 480px) {
#logoTitle  { width: 100%; margin-top: 14px; display: block; font-size: 26px; float:none; text-align: center; }
#head_access { margin: 14px 0;}
#head_access li { margin-right: 21px; }
#headerinfo p { font-size: 18px;}
#headerinfo ul li.tell {font-size: 18px;}
#headerinfo ul li.tell i {font-size: 21px;}
#headerlogo, #headerinfo, #headersubtext {width: 100%;float:none;  display: inline-block; margin: 0; padding:0; }
#headerlogo { padding-top: 14px; }
#logoImg { width: 100%; display: inline-block; float:none; text-align: center; }
li.head_list { display: none; }
#searchbox,
#alpha_search,
#google_search { margin: 5px auto; float: none; width: 95%; text-align:  right; }
}
@media screen and (min-width: 481px) and (max-width: 767px) {
#logoTitle  {  font-size: 30px; }
#headerinfo p { font-size: 18px;}
#headerinfo ul li.tell {font-size: 18px;}
#headerinfo ul li.tell i {font-size: 21px;}
#headerlogo, #headerinfo, #headersubtext {width: 100%;float:none;  display: inline-block; margin: 0; padding:0; }
#headerlogo { padding-top: 14px; }
}
@media screen and (min-width: 768px) and (max-width: 979px) {
#logoTitle  {  font-size: 32px; }
#headerinfo p { font-size: 18px;}
}
@media screen and (min-width: 980px)  {
#wrap_logo { display:table; width:100%; }
#toplogo, #topinfo, #topsubtext{ display: table-cell; margin: 0; vertical-align: bottom; }
#logoTitle  {  font-size: 32px; }
}
#footer_nav { width: 100%; margin: 0; padding: 14px 0; text-align: right; overflow : hidden; border-top:solid #555555 3px; }
#footer_nav ul { min-width: 280px; margin-right: 0; padding: 0; text-align: left; display: inline-block; }
#footer_nav ul li { min-width: 2em; margin: 0; padding: 0; float: left; display: inline-block; overflow:hidden; position: relative; }
#footer_nav ul li a, #footer_nav ul li a:visited { display: inline-block;
color: #2b2b2b; font-size: 16px; padding: 0px 10px;
letter-spacing: 0.1em;
border-left:1px solid #ccc;
text-decoration: none;
}
#footer_nav ul li a,
#footer_nav ul li a:visited {
box-shadow:1px 0 #ddd, -1px 0 #eee inset;
-pie-box-shadow: 1px 0 #ddd, -1px 0 #eee inset;
position: relative;
behavior: url(https://www.alphanet.co.jp/js/PIE.htc);
}
#footercbox { text-align: left; width: 100%; height: 100%; padding: 21px 0; margin: 0; overflow: hidden; background-color: #F0F0F0; }
.footer_title { position:relative; height:25px; font-size: 21px; padding-left: 21px; margin-bottom: 14px; }
.footer_title:before {
content:'';
height:25px;
width:2px;
display:block;
position:absolute;
top:-1px;
left:4px;
background-color:#333;
border-left: 4px solid #333;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
}
.ft_contactbox { margin-bottom: 14px; }
.footer-cols { float: left; width:30.3%; height: 100%; padding: 1.5%; }
.footer-cols {
padding-bottom: 800px;
margin-bottom: -800px;
}
.fc_title { margin-bottom: 1.5em; }
.footerclorsnav a, .footerclorsnav a:visited { color: #51565b; }
dl.addressbox { display: bloack; }
dl.addressbox dt { margin-bottom: 0.5em; }
dl.contactbox { clear: both;  margin-top: 10px; width: 100% }
dl.contactbox dt { float: left; width: 6em; clear: both; padding: 0; margin-bottom: 0.5em; font-weight: bold; height: auto; }
dl.contactbox dd { margin-bottom: 0.5em; margin-left: 6em; height: auto; }
@media screen and (min-width: 0px) and (max-width: 320px) {
.footerbox { padding: 1em; }
}
@media screen and (min-width: 321px) and (max-width: 480px) {
.footerbox { padding: 1em; }
}
@media screen and (min-width: 481px) and (max-width: 767px) {
.footerbox { padding: 1em; }
}
@media screen and (min-width: 768px) and (max-width: 979px) {
}
@media screen and (min-width: 980px)  {
}
#footer_bottom { margin: 0; padding: 21px 0; width: 100%; text-align: center; background-color:#000; color: #fff; }
#copyright { font-size: 11px; padding: 0; }
#copyright, #copyright a, #copyright a:visited { color: #fff; }
#poweredby { font-size: 11px; padding: 0 10px; font-family: "Monotype Corsiva"; }
#poweredby, #poweredby a, #poweredby a:visited { color: #ccc; }
#before_link, #curent_link, #next_link { display: inline-block; width: 27%; font-size: 13px; }
.linkicon { display: inline-block; width: 8%; font-size: 13px; padding: 18px 0 0; text-align: center; }
#curent_link { padding: 18px 0 0; }
#next_link { text-align: right; }
.nbnavi { display: inline-block; width: 100%; margin-bottom: 3px; }
#entrynavi a, #entrynavi a:visited { color: #51565b; }
#shrot_content .content_body.shortcon { height: 200px; overflow: hidden; cursor: pointer;position: relative;}
#shrot_content .content_body.shortcon, #shrot_content .content_body.shortcon > .opencontent {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
#shrot_content .content_body .opencontent { display: none; }
#shrot_content .content_body.shortcon > .opencontent {
position: absolute;
display: block;
bottom: 0;
left: 0;
width: 100%;
padding: 48px;
color :#f0f0f0;
text-align: right;
font-size: 24px;
background: -moz-linear-gradient(top,rgba(240,240,240,0.3),rgba(24,24,24,0.9)); /* Firefox用 */
background: -o-linear-gradient(rgba(240,240,240,0.3),rgba(24,24,24,0.9)); /* Opera */
background: -webkit-gradient(linear,left top,left bottom,from(rgba(240,240,240,0.3)),to(rgba(24,24,24,0.9)));
background: linear-gradient(top,rgba(240,240,240,0.3),rgba(24,24,24,0.9));
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#55505050', endColorstr='#ff181818', GradientType=0)";
}
.opencontent a, .opencontent a:visited { display: inline-block; width: 100%; height: 100%;color: #fff; font-weight: bold;text-decoration:none; }
#topLabeltitle { position: relative; }
#topLabeltitle .on_tt { position: absolute; bottom: 0; right: 14px; color: #fff; }
#topimgtitle {
height: auto;
display:table;
float: left;
margin: 14px 0 21px; padding: 7px 14px;
color: #51565b;
background-color: #CCC;
border: solid #ddd 1px;
font-size: 40px;
text-align: center;
line-height: 1.3;
overflow: hidden;
position: relative;
height: 90px;
}
#topimgtitle img { display: table-cell;  vertical-align: middle; margin-right; 1em; }
#topimgtitle span.side_tt { display: table-cell; height: 100%; vertical-align: middle; }
#mailnotes { font-size:13px; border:solid #ccc 1px; padding: 1em; margin: 2em 0; }
/* clearfix */
.clear { clear:both;display:block;overflow:hidden;visibility:hidden;width:100%;height:0 }
.clearfix { width:100%; }
.clearfix:after,
[class^="_body"]:after, [class*="_body "]:after,
[class^="wrap_"]:after ,[class*=" wrap_"]:after,
[id^="wrap_"]:after ,[id*=" wrap_"]:after,
.wrap:after { content: ""; display: block; clear: both; font-size:0; line-height:0; visibility:hidden; width:100%; height:0; }