@charset "UTF-8";

/* 共有エレメント---------------------------------------------- */
.clearfix:after {
    content: ""; display: block; clear: both;
}
.txt12{
    font-size: 12px;
    }
.txt14{
    font-size: 14px;
    }
.txt16{
    font-size: 12px;
    }
.txt18{
    font-size: 12px;
    }
span.color-blue {
    color: #37aee3;
    /* display: block; */
}
li {
    list-style:none;
}
#teaser a .detail{
    color: #37aee3;
}
.back-blue {
    background: #2090bf;
}
.txt_bold {font-weight: bold;}
.inner-width {
    margin-left:auto;
    margin-right:auto;
    margin-top: 50px;
}
p, ul, li, ol, dl, dd, dt, h1 {
margin: 0;
padding: 0;
}
.pc #vendor .follow-sns {
display: inline-block;
margin: 0 0 50px;
}
#teaser .lineup-list-box a {
    white-space: normal;
    line-height: 1.6em;
}
#w {
    background-color: #fff;
    /* font-size: medium; */
}
.page-top a:hover { text-decoration: none;
}
.post-contents .button, .post-contents .button::before, .post-contents .button::after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;

}
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.clearfix { display: inline-table; }

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */
/* 共有エレメント---------------------------------------------- */
#lineup-area {
    width: 100%;
    text-align: center;
    display: inline-block;
    margin-top: 40px;
}
.contents_block {
    padding: 100px 0;
}
.bg_gray {
    background: #f7f7f7;
}
h2.ttl,
.contents_box {
    width: 960px;
    margin: 0 auto;
}
.bg_white {
    background: #fff;
}
.contents_box.bg_white,
.contents_box.bg_gray {
    padding: 30px 0px;
    box-sizing: border-box;
}
.contents_box_inner{
	padding-left:40px;
	padding-right:40px;
}

.contents_box .txt_wrap {
    padding: 0 20px;
}
.contact_btn_area {
    margin: 0 auto;
    text-align: center;
}
.contact_btn_area .contact_btn {
    width: 800px;
    background-color: #253046;
    height: 110px;
    font-size: 22px;
    margin: auto;
    display: table;
    background-image: url(../images/teaser/icon-arrow01.png);
    background-repeat: no-repeat; background-position: 95% center;
}
.contact_btn_area .contact_btn a {
    display: table-cell;
    vertical-align: middle;
    color: #fff;
    line-height: 32px;
    border: solid 2px #253046;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all .3s;
    transition: all .3s;
}
.contact_btn_area .contact_btn a:hover {
    opacity: 0.8;
    background: #fff;
    color: #253046;
}
h1 {
    font-weight: normal;
    /* margin-bottom: 15px; */
}
h2 {
    margin: 0;
}
h2.ttl {margin-bottom: 60px;}

/* メインイメージ---------------------------------------------- */
#main-box .logo img {
width: 400px;
}
#main-box .logo {
position: relative;
z-index: 10;
/* margin-bottom: 50px; */
top: 170px;
/* width: 150px; */
}
#teaser #main-area {
width: 100%;
background: #f2f2f2;
height: 500px;
}
#teaser .main-ttl{
position: relative;
z-index: 8;
/* margin: 143px 0 50px; */
top: 120px;
}
#main-area .movie-popup-btn a {
position: relative;
margin: 0 auto;
z-index: 20;
top: 220px;
padding: 20px 0 0;
pointer:cursor;
/* border-style: none; */
overflow: hidden;
outline: none;
background-position: 0 0;
background-repeat: no-repeat;
background-image: url(../_images/teaser/movie-btn.png);
width: 75px;
height: 108px;
display: block;
}

#main-area .movie-popup-btn a:hover {
background-image: url(../_images/teaser/movie-btn_on.png);
}

.movie-popup-.btn a {
display: block;
opacity: 0.5;
height: 80px;
vertical-align:middle;
background: #fff;

}
.main-image {
position: relative;
top: -275px;
}
#teaser #main-box {
    width: 100%;
    height: 100%;
    max-width: 1500px;
    /* border: solid 2px #fff; */
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    /* margin-bottom: 20px; */
    position: relative;
    margin-top: 10px;
}
.sns-box.firstChild {
z-index: 10;
position: relative;
}
ineup-list ul {
    margin-right: auto;
    margin-left: auto;
}
#teaser ul.lineup-list {
    text-align: left;
    margin-bottom: 40px;
    /* display: inline-block; */
}

#teaser #lineup-box02 li {
height: 156px;
margin: 0 0 20px;
margin-top:10px
}
/* ヘッダーボタン（English-link/SNS）---------------------------------------------- */
.main-btnarea {
    width: 100%;
    margin: 10px auto 0;
    position: relative;
    text-align: right;
}
.main-btnarea .main-enlink {
    position: absolute;
    left: 0;
    top: -6px;
    background-color: #223146;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
}
.main-btnarea .main-enlink p {
    background-image: url('/images/teaser/lang-en.png');
    background-repeat: no-repeat;
    background-position: 10px 50%;
}
.main-btnarea .main-enlink a:link,
.main-btnarea .main-enlink a:visited {
    color: #fff;
    font-size: 13px;
    padding: 3px 10px 3px 32px;
    display: inline-block;
}

/* SNS （ヘッター）---------------------------------------------- */
.sns-box {
    height: 20px;
    z-index: 20;
    display: inline-block;
}
.sns-box > ul {
    display: block;
    float: right;
}
.sns-box > ul > li {
    float: left;
    display: block;
    margin-left: 10px;
}
.sns-box > ul > li a img {
    opacity: .85;
}
.sns-box > ul > li a:hover img {
    opacity: 1;
}
/* SNS（フッター）---------------------------------------------- */

.pc #link-various .follow-sns .sns-follow-fb{
    float: left;
}

.pc #link-various .follow-sns .sns-follow-tw{
	float: right;
}

.link-coverage {
    /* float: right; */
    /* line-height: 45px; */
    width: 960px;
    margin: 0 auto;
    text-align: right;
}
.link-coverage a {
    margin-top: 10px;
    font-size: 14px;
}
#link-various a {
/* line-height: 45px; */
}
/* ラインナップ ---------------------------------------------- */
#lineup-box li:nth-child(odd) {
    margin-right: 4px;
}
#lineup-box li {
    padding: 1px 1px;
    width: 476px;
    float: left;
    /* display: block; */
    height: 244px;
}
#lineup-box-want {
    /* padding: 20px; */
    /* border: solid 2px #37aee3; */
    text-align: left;
    background-repeat: no-repeat;
    background-position: 54px center;
    background-image: url(../_images/teaser/icon-mail.png);
    display: inline-block;
    width: 916px;
    margin-bottom: 30px;
}
#teaser .lineup-want-btn {
    float: right;
    width: 250px;
    height: 55px;
    background-color: #37aee3;
    text-align: center;
    line-height: 55px;
    color: white;
    font-size: 18px;
   border: solid 2px #37aee3;
    cursor: pointer;
    margin-top: 0.8em;
}
.agreement-btn {
    width: 250px;
    height: 55px;
    background-color: #37aee3;
    text-align: center;
    line-height: 55px;
    color: white;
    font-size: 18px;
   border: solid 2px #37aee3;
    cursor: pointer;
    margin-top: 0.8em;
}
.agreement-btn:hover {
    background-color: #fff;
    color: #37aee3;
    -webkit-transition: all .3s;
    transition: all .3s;
    border: solid 2px #37aee3;
}
#teaser .lineup-want-btn:hover {
    background-color: #fff;
    color: #37aee3;
    -webkit-transition: all .3s;
    transition: all .3s;
    border: solid 2px #37aee3;
}
#model-area-want .btn, .lineup-want-btn {
    background-repeat: no-repeat;
    background-position: 95% center;
}
#model-area-want .btn {
    background-image: url(../_images/teaser/icon-arrow-blue01.png);
}
.lineup-want-btn, #vendor .partnet-btn {
    background-image: url(../_images/teaser/icon-arrow01.png);
    background-repeat: no-repeat; background-position: 95% center;
}
#teaser a p {
line-height: 1.6em;
width: auto;
display: block;
float: left;
}
.partnet-btn a:hover {
opacity: 0.8;
}
.lineup-list-box p {
    padding: 0 10px;
}
.lineup-list p a {
    color: #333;
}
#teaser #lineup-box dd {
width: 468px;
height: 228px;
top: -236px;
}
#teaser #lineup-box dd, #teaser #lineup-box02 dd {
margin: 0;
position: relative;
background: #fff;
opacity: 0.9;
border: solid 4px #eee;
font-size: 14px;
display: none;
}
.lineup-list p .detail {
    color: #37aee3;
}
#lineup-box-want p {
    margin-left: 129px;
    margin-top: 5px;
    float: left;
    font-size: 32px;
    line-height: 1.6em;
    color: #37aee3;
}
.lineup-midashi {
    font-size: 16px;
}
#lineup-box .lineup-midashi {
    font-size: 16px;
    margin: 20px 0 10px 0;
    /* width: 400px; */
    /* display: inline-block; */
    font-weight: bold;
}

#lineup-box02 .lineup-midashi {
margin: 20px 0 10px 0;
}
#lineup-box, #lineup-box02 {
    margin-left: auto;
    margin-right: auto;
    background: #FFF;
    display: inline-block;
}
#lineup-box, #model-box, .lineup-list, .inner-width {
    width: 960px;
    text-align: center;
}
#model-box {
/* width: 920px; */
}
#lineup-box02 {
    /* width: 918px; */
    /* border: solid 1px #d2d2d2; */
    /* padding: 20px; */
    /* margin-bottom: 50px; */
}
.lineup-list-box dd {
    height: 156px;
    position: relative;
    top: -156px;
    display: none;
}
.lineup-list .detail {
    /* float: right; */
    margin: 10px 0 0;
    display: block;
    /* width: 100%; */
    text-align: right;
}
#lineup-box02 dt {
    float: left;
    margin-right: 20px;
    display: inline-block;
}
#lineup-box h1, #lineup-box02 h1 {
    text-align: left;
    margin: 0 0 10px;
}
#lineup-box h1 {
    font-size: 32px;
}
#lineup-box02 h1 {
    font-size: 24px;
}
#lineup-box02 dd {
}
element.style {
}
h1.lineup-ttl span {
position: relative;
top: -6px;
}
#lineup-area > h1 {
    font-size: 44px;
    text-align: left;
    text-align: center;
    margin: 0 0 20px;
}
#teaser .lineup-list-box a {
white-space: normal;
line-height: 1.6em;
}
.lineup-list-box span {
position: relative;
z-index: -1;
}
#teaser .lineup-list-box a:hover {
    /* opacity: 0.5; */
}
/* ポップアップ---------------------------------------------- */
#agreement-box h1 {
    text-align: center;
    font-size: 18px;
    margin: -12px 0 15px;
    width: 100%;
}
.agreement-check {
    display: block;
    width: 100%;
    text-align: center;
    margin-bottom: 10px;
    font-size: 14px;
}
.disable {
    opacity: 0.5;
}
#teaser #agreement-box-inline dl {
    border-bottom: solid 1px #37aee3;
    width: 100%;
    display: inline-block;
    padding: 10px 0;
}
#agreement-area{
    display: none;
    width: 100%;
    height:100%;
    text-align: center;
    position: fixed;
    top: 0;
    z-index: 100;
    background: rgba(255,255,255,0.7);
}
#agreement-area .btn-close{
    margin: -30px -10px;
    padding: 0;
    cursor: pointer;
    float: right;
}
#teaser #agreement-box {
    width: 864px;
    margin: 20px auto 0;
    z-index: 5;
    background: #fff;
    padding: 40px 40px 20px;
    text-align: left;
    border: solid 8px #37aee3;
    border-radius: 8px;
}
#agreement-thanks, #agreement-error {
    border: solid 8px #eee;
    border-radius: 8px;
}
.pc .agreement-midashi {
font-size: 14px;
margin: 20px 0 0 43px;
font-weight: bold;
}
#teaser #agreement-box h2 {
font-size: 12px;
font-weight: normal;
}
#teaser .agreement-box-inline-text {
    overflow-y: scroll;
    height: 100px;
    font-size: 10px;
    text-align: left;
    margin-bottom: 10px;
    width: 90%;
    margin: 0 auto 10px;
}
#agreement-error p {
margin-bottom: 20px;
font-size: 14px;
}
#agreement-thanks, #agreement-error {
    position:relative;
    top: 50%;
    left: 50%;
    width: 536px;
    height: 350px;
    margin: -175px 0 0 -268px;
    z-index: 10;
    background: #fff;
    padding: 20px;
display: block;
    text-align: center;
}
#agreement-area .agreement-submit, #agreement-thanks .agreement-back, #agreement-error .agreement-back {
    display: block;
    width: 250px;
    line-height: 40px;
    background: #37aee3;
    cursor: pointer;
    color: #fff;
    font-size: 16px;
    border: none;
    margin-left: auto;
    margin-right: auto;
    float: none;
}
.agreement-submit {
    display: block;
    width: 400px;
    line-height: 60px;
    background: #37aee3;
    cursor: pointer;
    color: #fff;
    font-size: 16px;
    border: none;
    margin-left: auto;
    margin-right: auto;
    float: none;
}
input#submit {
    /* background: #eee; */

}
.agreement-submit.disabled, #agreement-box input.agreement-submit.disabled {
    background: #e6e6e6;
}

#teaser #agreement-box-inline dt {
    font-weight: bold;
    font-size: 14px;
    padding: 0 2%;
    width: 28%;
    float: left;
    color: #37aee3;
}
#agreement-area .agreement-submit {
display: block;
width: 250px;
line-height: 40px;
background: #37aee3;
cursor: pointer;
color: #fff;
font-size: 16px;
border: none;
margin-left: auto;
margin-right: auto;
float: none;
}
#agreement-box-inline dt span {
    font-size: 12px;
    color: #666;
    display: block;
}
#teaser #agreement-box-inline dd {
padding: 5px 10px;

}
#teaser #agreement-box-inline dd {
    margin-bottom: 10px;
    padding: 0;
    float: left;
    width: 67%;
}
#agreement-box ul {
    text-align: left;
    padding: 0;
    margin: 0;
}
#teaser #agreement-box .agreement-robot li {
float: left;
width: 20%;
padding: 0;
text-align: center;
}
#agreement-box .agreement-robot li .pict{
width: 100%;
display: block;
margin-bottom: 10px;
}
#agreement-thanks h1, #agreement-error h1 {
    font-weight: normal;
    margin: 20% 0 20px;
    font-size: 23px;
    text-align: center;
}
#agreement-thanks p {
    font-size: 16px;
    width: 80%;
    margin: 0 auto 20px;
}

.attension {
    color: red;
    font-size: 12px;
}
#agreement-area .agreement-robot li {
    float: left;
    margin-right: 20px;
}
#movie-popup {
    display: none;
    width: 100%;
    height:100%;
    text-align: center;
    position: fixed;
    top: 0;
    z-index: 100;
    background: rgba(000,000,000,0.7);
}
#movie-popup-box {
    position: relative;
    top: 50%;
    left: 50%;
    width: 800px;
    /* height: 500px; */
    margin: -285px 0 0 -400px;
    z-index: 5;
    /* background: #fff; */
    text-align: center;
    /* border: solid 1px #ccc; */
}
p.movie-close {
position: relative;
top: 12px;
right: -400px;
cursor: pointer;
z-index: 20;
}
#youtube {
position: relative;
/* top: 40px; */
}







/* vendor---------------------------------------------- */
#vendor .txt_wrap {font-size: 18px;}
#vendor #about .txt_wrap {padding: 0;}
#vendor .main-box-txt {
margin: 40px auto;
font-size: 18px;
width: 900px;
line-height: 1.6em;
text-align: left;
}
.pc #model-area-want dd {
line-height: 1.6em;
position: relative;
}
#model-area-want dt,  #model-area-want dd {
line-height: 1.6em;
}
#model-area-want dt {
font-size: 15px;
margin: 0 0 10px;
font-weight: bold;
}

#vendor .wide_img{max-width:100%; display:block; margin:0 auto;}

#vendor #main-box {
text-align: center;
margin-top: 10px;
}
/*#vendor #main-box h1 {
background: #000;
}*/

#vendor h1 img {
width: 100%;
/*min-width: 910px;*/
}

#vendor #main-box h1 {
background: url(../images/bp/vendor_mv_bg.png) repeat-x;
}
#vendor #main-box h1 img {
width:100%;
display:block;
max-width:940px;
margin:0 auto;
}
#vendor #about .business_role {
    margin-bottom: 20px;
}


#partner-area {
    width: 100%;
    padding: 20px 0;
    text-align: center;
    margin-bottom: 10px;
}
.partnet-btn {
    margin-right: auto;
    margin-left: auto;
}

 #cloud-box h1{
    font-size: 32px;
    margin-bottom: 50px;
}
#model-area-want-box {
display: block;
float: left;
}

#model-area-want-box img {
margin-top: 10px;
}
#vendor .partner-area {
margin: 0 auto;
}
#model-area-want .btn {
float: right;
width: 250px;
border: solid 2px #37aee3;
color: #fff;
background-color: #37aee3;
font-size: 16px;
line-height: 45px;
display: block;
margin: 10px -5px 0;
text-align: center;
}
.pc #model-area-want .btn {
position: absolute;
top: 200px;
}
#model-area-want ul {
margin: 0 15px 12px;
}
#model-area-want dl {
width: 280px;
float: left;
margin: 0 5px;
}
#model-area > h1 {
font-size: 32px;
margin-bottom: 30px;
}
#model-area-want dl {
width: 246px;
float: left;
margin: 0 5px;
text-align: left;
background: #fff;
padding: 20px;
height: 290px;
}
#model-area {
    background: #f7f7f7;
    /* padding-bottom: 20px; */
    /*padding-top: 40px;*/
    text-align: center;
    margin: 0 auto;
}
#proposal .img_wrap {
    /*margin-left: -50px;*/
}
#proposal .img_wrap.three_supports {
    margin-bottom: 80px;
}
#dealer .img_wrap.dealer_type {
    margin-bottom: 60px;
    margin-left: 19px;
}
#dealer .txt_wrap {
    margin-bottom: 40px;
}
#link-various {
    padding-top: 50px;
}
#vendor .partnet-btn {
    width: 800px;
    background-color: #253046;
    height: 110px;
    font-size: 22px;
    margin: auto;
    display: table;
}
.partnet-btn a, #model-area-want .btn a, .lineup-want-btn {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all .3s;
transition: all .3s;
}
#vendor .partnet-btn a:hover {
    background:#fff;
    color:#253046;
}
#model-area-want {
background: #f7f7f7;
display: inline-block;
width: 890px;
margin: 30px 20px 20px;
padding: 20px 15px;
}
#model-area-want h1 {
font-size: 24px;
/* padding: 0 0 20px; */
text-align: left;
}
#model-area-want h1 {
font-size: 24px;
float: left;
/* width: 600px; */
display: inline-block;
margin: 10px 0 20px 8px;
}

#model-area-want li {
    list-style-type: disc;
    line-height: 1.6em;
}
/*#vendor .partner-area {
    padding: 50px 0;
}*/
#vendor .partnet-btn a {
    display: table-cell;
    vertical-align: middle;
    color: #fff;
    line-height: 32px;
    border: solid 2px #253046;
}

#cloud-box {
    background: #fff;
    padding: 50px 0 30px;
    text-align: center;
    /* width: 960px; */
}
#cloud-box .cloud-box-txt, #model-box .model-box-txt {
    margin: 30px auto 0;
    display: block;
    font-size: 14px;
    text-align: left;
}
#model h1 {
    font-size: 24px;
}
.partner-area  {
    text-align: center;
}
.covervid-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
#model-area-want .btn a {
    display: block;
    color: #fff;
}
#model-area-want .btn a:hover {
display: block;
background-color:#fff;
color:#37aee3;
}
.pc .follow-sns {
display: inline-block;
margin-bottom: 40px;
width: 704px;
}
#link-various > p {
font-size: 18px;
margin: 0 0 9px;
}
.show{
    display:block;
    }
    p.back-text {
font-size: 14px;
text-align: left;
/* width: 900px; */
margin: 10px auto 0;
display: inline-block;
float: left;
}
.lineup-list .lineup-list-box a.li01, .lineup-list .lineup-list-box a.li02, .lineup-list .lineup-list-box a.li03, .lineup-list .lineup-list-box a.li04 {
background-position: 0 0;
width: 476px;
height: 237px;
display: block;
/* text-indent:-9999px; */
    background-repeat: no-repeat;
}
.lineup-list .lineup-list-box a.li05 {
background-position: 0 0;
width: 961px;
height: 156px;
display: block;
text-indent:-9999px;
    background-repeat: no-repeat;
}
.lineup-list .lineup-list-box a.li01 {
    background-image: url(../_images/teaser/lineup01.jpg);

}
.lineup-list .lineup-list-box a.li01:hover {
background-image: url(../_images/teaser/lineup01_on.jpg);
}
.lineup-list .lineup-list-box a.li02 {
background-image: url(../_images/teaser/lineup02.jpg);
}
.lineup-list .lineup-list-box a.li02:hover {
background-image: url(../_images/teaser/lineup02_on.jpg);
}
.lineup-list .lineup-list-box a.li03 {
background-image: url(../_images/teaser/lineup03.jpg);
}
.lineup-list .lineup-list-box a.li03:hover {
background-image: url(../_images/teaser/lineup03_on.jpg);
}
.lineup-list .lineup-list-box a.li04 {
background-image: url(../_images/teaser/lineup04.jpg);
}
.lineup-list .lineup-list-box a.li04:hover {
background-image: url(../_images/teaser/lineup04_on.jpg);
}
.lineup-list .lineup-list-box a.li05 {
background-image: url(../_images/teaser/lineup05.jpg);
}
.lineup-list .lineup-list-box a.li05:hover {
background-image: url(../_images/teaser/lineup05_on.jpg);
}

/* developer---------------------------------------------- */
/*#developer .txt_wrap {font-size: 18px;}
#developer #main-box {
    margin-top: 10px;
    margin-bottom: 100px;
}
#developer h1 img {
    width: 100%;
}
#developer #main-box .txt_wrap {
    margin: 60px 0;
}
#developer #support .ttl {
    font-size: 28px;
    text-align: center;
    font-weight: normal;
}
#developer #support .support_plan {
    padding: 0 35px;
    margin-bottom: 20px;
}*/

/* 記者会見---------------------------------------------- */
.pc #interview-area {
background: #f9f9f9;
text-align: center;
padding: 50px;
margin-top: 50px;
}
.pc #interview-area h1 {
font-size: 28px;
margin-bottom: 20px;
}

#interview-area a img:hover {
opacity: 0.5;
}


/*
    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; overflow:hidden;}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}

div#cboxLoadedContent {
}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/*
    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: #222; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
    #cboxTopLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -101px 0;}
    #cboxTopRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -130px 0;}
    #cboxBottomLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -101px -29px;}
    #cboxBottomRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -130px -29px;}
    #cboxMiddleLeft{width:21px; background:url(images/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(images/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(images/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(images/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff; overflow:hidden;padding: 10px;border-radius: 4px;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxLoadingOverlay{background:url(images/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }

        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}

        #cboxClose{position:absolute; top: 0; right:0; background:url(../_images/teaser/close.png) no-repeat 0 0; width:27px; height:27px; text-indent:-9999px;}

/*
  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 or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.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);
}
