/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{}
#cboxTitle{margin:0px;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

/*
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000;}
#colorbox{}

    #cboxContent{}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:28px;box-sizing:border-box;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0; background:url(http://static.blogos.com/pc/image/colorbox/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious.hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(http://static.blogos.com/pc/image/colorbox/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext.hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(http://static.blogos.com/pc/image/colorbox/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(http://static.blogos.com/pc/image/colorbox/loading.gif) no-repeat center center;}
        #cboxClose{position:absolute; top:-10px; right:10px; background:url(http://static.blogos.com/lite/image/button_lb_close.png) no-repeat left top;background-size: 28px 28px; width:28px; height:28px; text-indent:-9999px;}
        #cboxClose.hover{background-position:0 -133px;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to IE9.
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}

/*
  The following provides PNG transparency support for IE6
*/
.cboxIE6 #cboxTopLeft{background:url(http://static.blogos.com/pc/image/colorbox/ie6/borderTopLeft.png);}
.cboxIE6 #cboxTopCenter{background:url(http://static.blogos.com/pc/image/colorbox/ie6/borderTopCenter.png);}
.cboxIE6 #cboxTopRight{background:url(http://static.blogos.com/pc/image/colorbox/ie6/borderTopRight.png);}
.cboxIE6 #cboxBottomLeft{background:url(http://static.blogos.com/pc/image/colorbox/ie6/borderBottomLeft.png);}
.cboxIE6 #cboxBottomCenter{background:url(http://static.blogos.com/pc/image/colorbox/ie6/borderBottomCenter.png);}
.cboxIE6 #cboxBottomRight{background:url(http://static.blogos.com/pc/image/colorbox/ie6/borderBottomRight.png);}
.cboxIE6 #cboxMiddleLeft{background:url(http://static.blogos.com/pc/image/colorbox/ie6/borderMiddleLeft.png);}
.cboxIE6 #cboxMiddleRight{background:url(http://static.blogos.com/pc/image/colorbox/ie6/borderMiddleRight.png);}

.cboxIE6 #cboxTopLeft,
.cboxIE6 #cboxTopCenter,
.cboxIE6 #cboxTopRight,
.cboxIE6 #cboxBottomLeft,
.cboxIE6 #cboxBottomCenter,
.cboxIE6 #cboxBottomRight,
.cboxIE6 #cboxMiddleLeft,
.cboxIE6 #cboxMiddleRight {
//    _behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");
}



/* original */
.mainpanelbox {
	background:#f1f1f1;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	text-align: left;
}

.mainpanelbox h2 {
	-webkit-border-top-left-radius: 20px;
	-webkit-border-top-right-radius: 20px;
	-moz-border-radius-topleft: 20px;
	-moz-border-radius-topright: 20px;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	background:url(http://static.blogos.com/pc/image/common/login_bar_grade.png) repeat-x 0 0;
	font-size:20px;
	height:51px;
	padding-left:20px;
	line-height:45px;
	color:#fff;
}
.mainpanelbox h3 {
	font-size:18px;
	margin-bottom:5px;
	margin-left:40px;
	margin-right:40px;
}
.mainpanelbox p.info {
	font-size:14px;
	line-height:24px;
	margin-bottom:20px;
	margin-left:40px;
	margin-right:40px;
}
#login_panel p.info {
	line-height: 1.63em;
}
.mainpanelbox label.rule {
	font-size:14px;
	margin-bottom:20px;
	margin-right:40px;
}
.mainpanelbox p.info img.icon {
	margin-right:5px;
}

#login_panel .mainpanel-body {
	padding:20px;
	min-height:400px;
}
ul.providers{
	margin-left:40px;
	overflow: hidden;
	zoom: 1;
}

ul.providers li{
	display:inline;
}
ul.providers a {
	display:block;
	float:left;
	width:200px;
	height:35px;
	text-indent: -9999px;
	margin-bottom:10px;
}
.bt_facebook a{
	background:url(http://static.blogos.com/pc/image/common/login_btn.png) no-repeat 0 0;
}
.bt_facebook a:hover{
    background-position:0 -35px;
}
.bt_twitter a{
	background:url(http://static.blogos.com/pc/image/common/login_btn.png) no-repeat 0 0;
	background-position:-200px 0;
}
.bt_twitter a:hover{
    background-position:-200px -35px;
}
.bt_livedoor a{
	background:url(http://static.blogos.com/pc/image/common/login_btn.png) no-repeat 0 0;
	background-position:-400px 0;
}
.bt_livedoor a:hover{
    background-position:-400px -35px;
}
.bt_yahoo a{
	background:url(http://static.blogos.com/pc/image/common/login_btn.png) no-repeat 0 0;
	background-position:-600px 0;
}
.bt_yahoo a:hover{
    background-position:-600px -35px;
}
.bt_mixi a{
	background:url(http://static.blogos.com/pc/image/common/login_btn.png) no-repeat 0 0;
	background-position:-800px 0;
}
.bt_mixi a:hover{
    background-position:-800px -35px;
}

div.cando
,div.thxbox{
	margin-top:20px;
	margin-bottom:15px;
	padding:20px auto;
	text-align:center;
}
.mainpanel-body:after {
    content:" ";
    display:block;
    clear:both;
    height:0;
    visibility:hidden;
    }
.mainpanel-body {
    zoom:1;
    }

.first-auth {
	width:48%;
	float:left;
	margin-bottom:20px;
}
.first-auth .auth-info {
	font-size:16px;
	line-height:24px;
	margin-bottom:20px;
	margin-top:40px;
	margin-right:40px;
}
.second-auth {
	width:48%;
	float:right;
	margin-bottom:20px;
}
#btnbox {
	margin-top:40px;
}
.first-auth .wrap
,.mainpanel-body #append_auth_panel_error
,.mainpanel-body #login_panel_error {
	margin-left:40px;
}
#authorized2 {
	background:url(http://static.blogos.com/pc/image/common/line_auth.gif) repeat-y 50% 0;
}



/* 説明 */

div#login_tab {
width: 670px;
position: relative;
}

div#login_tab .login_detitle {
border-top: solid 1px #FFFFFF;
width: 590px;
margin: 0 auto;
}

div#login_tab .login_detitle h3 {
width: 590px;
margin: 0 auto;
padding: 23px 0 15px 0;
font-size: 18px;
font-weight: bold;
color: #333333;
border-top: solid 1px #E0E0E0;
}

/* Showcase
-------------*/

#awOnePageButton .view-slide
{
display: none;
}

/* This class is removed after the showcase is loaded */
/* Assign the correct showcase height to prevent loading jumps in IE */
.showcase-load
{
height: 380px; /* Same as showcase javascript option */
overflow: hidden;
}


/* Container when content is shown in slider */
.showcase {
position: relative;
margin: auto;
}

/* Navigation arrows */
.showcase-arrow-previous,
.showcase-arrow-next {
display:  block;
position: absolute;
top: 160px;
width: 24px;
height: 37px;
text-indent: -9999px;
cursor: pointer;
}
.showcase-arrow-previous {
left: -40px;
background: url(http://static.blogos.com/pc/image/common/login_btn_back_next.gif) no-repeat 0 0;
}
.showcase-arrow-previous:hover {
background: url(http://static.blogos.com/pc/image/common/login_btn_back_next.gif) no-repeat 0 -40px;
}
.showcase-arrow-next {
right: -40px;
background: url(http://static.blogos.com/pc/image/common/login_btn_back_next.gif) no-repeat -25px 0;
}
.showcase-arrow-next:hover {
background: url(http://static.blogos.com/pc/image/common/login_btn_back_next.gif) no-repeat -25px -40px;
}

/* Content */
.showcase-content-wrapper {
height: 380px;
width: 590px;
display: table-cell;
vertical-align: middle;
}

/* Styling the caption */
.showcase-caption
{
color: #000;
padding: 8px 15px;
text-align: left;
position: absolute;
bottom: 10px; left: 10px; right: 10px;
display: none;
}


/* Button Wrapper */
.showcase-button-wrapper {
    position: absolute;
top: -30px;
right: 0;
    padding: 0;
}

.showcase-button-wrapper span {
    float: left;
    margin-left: 3px;
    cursor: pointer;
    text-indent: -9999px;
background: url(http://static.blogos.com/pc/image/common/status_.png) no-repeat 0 -12px;
    width: 10px;
    height: 10px;
    overflow: hidden;
}

.showcase-button-wrapper span.active,
.showcase-button-wrapper span:hover {
background: url(http://static.blogos.com/pc/image/common/status_.png) no-repeat 0 0;
}




/* Clear (used for horizontal thumbnails)
-------------------------------------------*/

.clear
{
clear: both;
display: block;
overflow: hidden;
visibility: hidden;
width: 0;
height: 0;
float: none;
}

/* login panel */

#login_panel .mainpanel-body .clearfix {
  margin: 10px 0;
}
#login_panel .mainpanel-body .info {
  font-size: 13px;
  margin-bottom: 10px;
}
#login_panel .mainpanel-body .note {
  margin: 0 40px 10px 40px;
  font-weight: bold;
}
#login_panel .mainpanel-body .note strong {
  color: #cc0000;
}

/* append-auth-panel */

#append-auth-panel .mainpanel-body {
  padding: 20px 60px;
}
#append-auth-panel .mainpanel-body h3 {
  margin: 0 0 15px 0;
}
#append-auth-panel .mainpanel-body h4 {
  margin: 0;
  font-size: 16px;
}
#append-auth-panel .mainpanel-body h3 img {
  float: left;
  margin-right: 20px;
}
#append-auth-panel .mainpanel-body p {
  margin: 20px 0 5px 0;
  line-height: 1.7;
  color: #666666;
}
#append-auth-panel .mainpanel-body p a {
  font-weight: bold;
  color: #18488a;
}
#append-auth-panel .mainpanel-body .providers {
  margin: 10px 0 0 0;
}
#append-auth-panel #append_auth_panel_error {
  display: block;
  height: 1em;
  margin: 0;
  color: #ff0000;
  font-weight: bold;
}