@charset "utf-8";
/* CSS Document */

/*	#reset
--------------------------------------------*/
html, body, div, span, object, embed, param, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 100%;
    border: 0;
    vertical-align: bottom;
    outline: 0; }

body {
    color: #333333;
    line-height:1.4;
    font-size: 93%;
    background-color: white;
    width: 100%;
    font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro, Arial, Helvetica, sans-serif;
    -webkit-text-size-adjust: 100%; }

a {
    text-decoration: none;
    color: #4b4b4b;
    cursor: pointer; }
    a:link, a:visited, a:active, a:hover {
        text-decoration: none;
        color: #4b4b4b; }
li {
    list-style: none; }
th {
    font-weight:normal; }
h1, h2, h3, h4, h5, h6, b, strong {
    font-weight: normal; }


/*	#header
--------------------------------------------*/
#header {
    width: 100%;
    border-bottom: 4px #aac467 solid;
    margin: 0 auto; }
#header .head_wrapper {
    background-color: #6ca031; }
#header .wrap {
    display: block;
    max-width: 800px;
    width: 100%;
    margin: 0 auto;
    padding: 20px 0 0 0; }

/* ロゴ/タイトル */
#header .mainNavi {
    width: auto;
    float: left;
    margin: 4px 0 0 0;
}
#header .mainNavi li {
    display: table-cell;
    vertical-align: middle;
}
#header .mainNavi .logo {
    display: block;
    background: url(../image/LCVlogo.png) no-repeat 0 0;
    background-size: contain;
    width: 48px;
    height: 22px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}
/* IE6,7,8 background-size substitution standard image */
.ie #header .mainNavi .logo {
    background: url(../image/ie/LCVlogo.png) no-repeat 0 0;
}
#header .mainNavi .logo a{
    display: block;
    background: none;
    width: 48px;
    height: 22px;
}
#header .mainNavi h1 {
    background: url(../image/Title.png) no-repeat 0 0;
    background-size: contain;
    width: 172px;
    height: 22px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}
/* IE6,7,8 background-size substitution standard image */
.ie #header .mainNavi h1 {
    background: url(../image/ie/Title.png) no-repeat 0 0;
}

/* ホーム/エリアボタン */
#header .gnav {
    padding: 2px 0 0 0;
    float: right;
}
#header .gnav li {
    padding: 0 0 0 4px;
    float: left;
}
#header .gnav .nav1 a {
    display: block;
    background: url(../image/homeBtn.png) no-repeat 0 0;
    width: 133px;
    height:28px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden; }
#header .gnav .nav2 .menuBtn {
    display: block;
    background: url(../image/areaBtn.png) no-repeat 0 0;
    width: 133px;
    height:28px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer; }

/* エリアメニュー */
#header .subNav {
    position: relative;
    max-width: 800px;
    width: 100%; }
#header .areaNav {
    display: none;
    position: absolute;
    right: 2px;
    overflow: visible!important;
    z-index: 1; }
#header .arealist {
    background: #f7faf1;
    width: 140px;
    overflow: hidden;
    zoom: 1;
    text-align: center; }
#header .arealist li {
    margin-top: -1px;
    border-top: 1px solid #dcdcdc; }
#header .arealist li a {
    position: relative;
    display: block;
    padding: 8px 0;
    margin: 0;
    text-decoration: none; }
#header .close {
    display: block;
    background: #dcdcdc;
    text-align: center;
    padding: 8px 0; }

/* 説明文 */
#header .explain  {
    max-width: 800px;
    margin: 0 auto;
    padding: 10px 18px;
}
.notes {
    max-width: 800px;
    margin: 0 auto;
    padding: 10px 18px;
}
    .notes ul {
        padding: 8px 10px;
        background-color: #ffebe8;
        border: 1px solid #ff0000;
        }
        .notes li {
            list-style-type: disc;
            list-style-position: outside;
            margin-left: 1em;
            }

/*	#background
--------------------------------------------*/
#content_background {
    width: 100%;
    height: auto;
    background-color: #ffffff; }


/*	#wrapper
--------------------------------------------*/
#content_wrapper,
#content_wrapper_2,
#content_wrapper_3,
#content_wrapper_4,
#link_wrapper,
#page_top {
    background-color: white;
    max-width: 800px;
    margin: 0px auto; }
    #content_wrapper img.map {
        width: 100%;
        height: auto; }
    #link_wrapper {
        padding: 10px 30px 20px; }


/*	bread_crumb
--------------------------------------------*/
.breadCrumb {
    background-color: white;
    font-size: 86%;
    max-width: 800px;
    margin: 0px auto;
    padding: 8px 60px;
    margin-bottom: 10px; }
.breadCrumb ul {
    margin:0 auto; }
.breadCrumb ul:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden; }
.breadCrumb li {
    float:left;
    padding:0 6px 0 0; }
.breadCrumb li span {
    margin:0 6px 0 0; }
.breadCrumb li:after {
    content:">"; }
.breadCrumb li:last-child:after {
    content:""; }


/*	content_area
--------------------------------------------*/
#camera_point {
    display: block;
    position:absolute; }
.carIcon {
    display: block;
    width:42px;
    height:36px;
    background:url(../image/car.png) no-repeat 0 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden; }
/* IE6,7,8 background-size substitution standard image */
.ie .carIcon {
    background: url(../image/ie/car.png) no-repeat 0 0;
}


/*	page_top
--------------------------------------------*/
.pageTop {
    text-align:right;
    padding: 0 30px 0 0; }


/*	#footer
--------------------------------------------*/
#footer #copyright {
    background-color: #aac467;
    padding: 10px 0;
    text-align: center;
    font-size: 86%;
    -ms-word-break: break-all;
    word-break: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto; }


/*	p
--------------------------------------------*/
.caption {
    padding: 10px 0 0;
    font-size: 172%;
    color: #777777;
    text-align: center; }
.notice {
    padding: 10px 10px 2px;
    font-size: 72%;
    text-align: center; }
.notice02 {
    padding: 22px 0 20px; }


/*	other
--------------------------------------------*/
.fntXS { font-size:71.4%; }
.fntS { font-size:86%; }
.fntM { font-size:100%; }
.fntL { font-size:114%; }
.fntXL { font-size:128%; }
.fntXXL { font-size:142%; }

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

.bold_black {
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #000000;
    -webkit-text-fill-color: #000000; }

.bold_gray {
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #777777;
    -webkit-text-fill-color: #777777; }

.bold_white {
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #ffffff;
    -webkit-text-fill-color: #ffffff; }

.error_message {
    margin: 0 0 20px;
    padding: 8px 10px;
    background-color: #ffebe8;
    border: 1px solid #ff0000; }
    .error_message p {
        color: #ff0000; }

.alpha a:hover img,
.alpha button:hover img,
.alpha-4cut a:hover img,
.alpha a:hover .carIcon {
    opacity: 0.8;
    -khtml-opacity: 0.8;
    -moz-opacity: 0.8;
    zoom: 1;
}
.alpha a:hover img,
.alpha button:hover img,
.alpha-4cut a:hover img {
    filter: alpha(opacity=80);
    -ms-filter: "alpha(opacity=80)";
    background-color: #fff\9; /* IE Hack */
}
.alpha-4cut a:hover img {
    background-color: #dce4cd\9; /* IE Hack */
}

.box-shadow {
    -moz-box-shadow: 2px 2px 3px #808080; /* FireFox */
    -webkit-box-shadow: 2px 2px 3px #808080; /* webkit */
    box-shadow:2px 2px 3px #808080;
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=135,strength=3,enabled=true)";
    filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000,direction=135,strength=3,enabled=true); /* IE5.5+ */
    background: #fff; /* IE Hack */ }

.allHide {
    display: none !important;
}


/*	hr
--------------------------------------------*/
hr {
    height: 1px;
    margin: 0px auto;
    border: none;
    background-color: #cccccc; }


/*	#a
--------------------------------------------*/
#link_base {
    text-decoration: underline;
    color: #00C; }


/*	table
--------------------------------------------*/
table {
  border: 1px solid #bbbbbb;
  border-collapse: collapse;
  background-color: #f8f8f8;
  width: 100%; }
  table td, table th {
    border: 1px solid #999; }
  table th {
    white-space: nowrap;
    font-size: 115%;
    padding: 8px 8px; }
  table td {
    padding: 8px 4px; }
  table.select_camera {
    border-collapse: separate;
    border-spacing: 0;
    border-top: 1px solid #bbbbbb;
    border-left: 1px solid #bbbbbb;
    border-bottom: 0;
    border-right: 0;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px; }
    table.select_camera th {
      background-color: #6ca031;
      color: #ffffff; }
    table.select_camera th,
    table.select_camera td {
      border-top: 0;
      border-left: 0;
      border-bottom: 1px solid #bbbbbb;
      border-right: 1px solid #bbbbbb; }
    table.select_camera th p.right,
    table.select_camera td img.right {
        float:right; }
    table.select_camera tr.parent {
      background-color: #dce4cd; }
    table.select_camera td.details {
      vertical-align: middle;
    }
    table.select_camera td.indent {
      padding-left: 0.75em;
    }
    table.select_camera th.bordernone,
    table.select_camera td.bordernone {
      border-right: none;
    }
    table.select_camera td.button {
      width: 43%;
      table-layout: fixed;
    }
    table.select_camera tr:first-of-type th:first-of-type {
      border-right: 1px solid #bbbbbb;
      -webkit-top-left-border-radius: 8px;
      -moz-border-top-left-radius: 8px;
      border-top-left-radius: 8px; }
    table.select_camera tr:first-of-type th:last-of-type {
      -webkit-top-right-border-radius: 8px;
      -moz-border-top-right-radius: 8px;
      border-top-right-radius: 8px; }
    table.select_camera tr:last-of-type th:first-of-type {
      -webkit-bottom-left-border-radius: 8px;
      -moz-border-bottom-left-radius: 8px;
      border-bottom-left-radius: 8px; }
    table.select_camera tr:last-of-type th:last-of-type {
      -webkit-bottom-right-border-radius: 8px;
      -moz-border-bottom-right-radius: 8px;
      border-bottom-right-radius: 8px; }
    table.select_camera tr:first-of-type td, table.select_camera tr:first-of-type th, table.select_camera tr:last-of-type td, table.select_camera tr:last-of-type th {
      background-color: #6ca031;
      color: #ffffff; }

/* 映像ボタン説明文 */
table.select_camera th p.hintBtn {
    display: block;
    background: url(../image/hintIcon.png) no-repeat 0 0;
    background-size: contain;
    width: 21px;
    height:21px;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer; }
/* IE6,7,8 background-size substitution standard image */
.ie table.select_camera th p.hintBtn {
    background: url(../image/ie/hintIcon.png) no-repeat 0 0;
}
#content_wrapper_2 .hint_wrap {
    position: relative;
    max-width: 800px;
    width: 100%; }
#content_wrapper_2 .hintNav {
    display: none;
    position: absolute;
    top: 32px;
    right: -8px;
    overflow: visible!important;
    z-index: 2;
    background: #f7faf1;
    color: #333333;
    font-size: 86%;
    margin: 8px 10px 0 0;
}
#content_wrapper_2 .hintlist {
    background: #f7faf1;
    width: 294px;
    overflow: hidden;
    zoom: 1;
    padding: 8px;
}
#content_wrapper_2 .hintlist li {
    padding: 8px 0;
    margin: 0;
}
#content_wrapper_2 .hintlist li.public {
    background: url(../image/movieBtn_0.png) no-repeat left;
    background-size: 54px auto;
}
/* IE6,7,8 background-size substitution standard image */
.ie #content_wrapper_2 .hintlist li.public {
    background: url(../image/ie/movieBtnS_0.png) no-repeat left;
}
#content_wrapper_2 .hintlist li.member {
    background: url(../image/movieBtn_1.png) no-repeat left;
    background-size: 54px auto;
}
/* IE6,7,8 background-size substitution standard image */
.ie #content_wrapper_2 .hintlist li.member {
    background: url(../image/ie/movieBtnS_1.png) no-repeat left;
}
#content_wrapper_2 .hintlist li.login {
    background: url(../image/movieBtn_2.png) no-repeat left;
    background-size: 54px auto;
}
/* IE6,7,8 background-size substitution standard image */
.ie #content_wrapper_2 .hintlist li.login {
    background: url(../image/ie/movieBtnS_2.png) no-repeat left;
}
#content_wrapper_2 .hintlist li span {
    overflow: hidden;
    padding: 0 0 0 60px;
}


/*	#link
--------------------------------------------*/
#link_wrapper .explain {
  font-size: 86%;
  background: url(../image/linkIcon.png) no-repeat 0 50%;
  background-size: 11px;
  padding: 0 0 0 15px; 
  margin: 12px 0 4px;
  float: right; }
/* IE6,7,8 background-size substitution standard image */
.ie #link_wrapper .explain {
    background: url(../image/ie/linkIcon.png) no-repeat 0 50%;
}

#link_wrapper h3.link {
  background-color: #6ca031;
  color: #ffffff;
  font-size: 115%;
  margin: 0 auto;
  padding: 8px 0 8px 8px; }
#link_wrapper ul.link {
  list-style: none;
  margin: 0 auto; }
  #link_wrapper ul.link li {
    list-style: none;
    overflow: auto;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#e8e8e8));
    background-image: -webkit-linear-gradient(top, #fafafa, #e8e8e8);
    background-image: -moz-linear-gradient(top, #fafafa, #e8e8e8);
    background-image: -ms-linear-gradient(top, #fafafa, #e8e8e8);
    background-image: -o-linear-gradient(top, #fafafa, #e8e8e8);
    background-image: linear-gradient(to bottom, #fafafa, #e8e8e8);
    filter: 'progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr="#fafafa", endColorstr="#e8e8e8")';
    border-bottom: 1px solid #bbb; }
    #link_wrapper ul.link li a {
      position: relative;
      display: block;
      margin: 0;
      padding: 10px;
      text-decoration: none; }
    #link_wrapper ul.link li span {
      background: url(../image/linkIcon.png) no-repeat 100% 50%;
      background-size: 11px;
      padding: 0 16px 0 15px; }
    /* IE6,7,8 background-size substitution standard image */
    .ie #link_wrapper ul.link li span {
        background: url(../image/ie/linkIcon.png) no-repeat 100% 50%;
    }


/*	#form
--------------------------------------------*/
#login-form {
    width: 100%;
    margin: 0 0 10px; }
    #login-form dt {
        padding-bottom: 10px;
        text-align: left;
        width: 40%;
        vertical-align: middle; }
        #login-form dt label {
            display: block;
            background: #e8e8e8;
            padding: 8px 10px; }
    #login-form dd {
        padding: 0 20px 10px 20px;
        vertical-align: middle; }
        #login-form dd input {
            padding: 8px;
            width: 100%;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            border: 1px solid #ddd;
            background: #FEFEFE;
            font-family: inherit; }
    #login-form .forget {
        padding: 0 20px 10px 0;
        text-align: right; }


/*	#button
--------------------------------------------*/
#button-base {
    text-align: center; }
    #button-base button {
        background: none;
        border: none;
        cursor: pointer;
}
.btnLogin,
.btnBack {
    margin: 20px 0 0;
    text-align: center; }
    .btnLogin a,
    .btnBack button img {
        background-color: transparent;
        -webkit-touch-callout:none;
        -webkit-tap-highlight-color:rgba(0, 0, 0, 0); }


/*	#modal
--------------------------------------------*/
.semantic-content, .modal--show {
    -webkit-transform: translate(0, 100%);
    -moz-transform: translate(0, 100%);
    -o-transform: translate(0, 100%);
    -ms-transform: translate(0, 100%);
    transform: translate(0, 100%);
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    width: 0;
    height: 0;
    overflow: hidden;
    opacity: 0;
    display: none\9;
}
.semantic-content:target, .modal--show:target, .is-active.semantic-content, .is-active.modal--show {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
    width: auto;
    height: auto;
    opacity: 1;
}
.is-active.semantic-content, .is-active.modal--show {
    display: block\9;
    height: 100%\9;
    width: 100%\9;
}
.semantic-content:target, .modal--show:target, .is-active.semantic-content, .is-active.modal--show {
    display: block\9;
}
.semantic-content .modal-inner, .modal--show .modal-inner {
    position: relative;
    top: 50px;
    z-index: 20;
    margin: 0 auto;
    width: 318px;
    overflow-x: hidden;
    background: #fff;
    -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
    -webkit-overflow-scrolling: touch;
}
@media \0screen\,screen\9 {
    .semantic-content .modal-inner, .modal--show .modal-inner {
        background: transparent;
    }
}
.semantic-content .modal-content, .modal--show .modal-content {
    position: relative;
    /*
    max-height: 400px;
    max-height: 80vh;
    */
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
@media \0screen\,screen\9 {
    .semantic-content .modal-content, .modal--show .modal-content {
        overflow: visible;
    }
}
.semantic-content .modal-content > *, .modal--show .modal-content > * {
    max-width: 100%;
}
.semantic-content header, .modal--show header {
    border-bottom: 1px solid #ffffff;
    background: #e8e8e8;
    padding: 0.5em 1.0em;
}
.semantic-content header > h2, .modal--show header > h2 {
    font-size: 115%;
}
.semantic-content .modal-content, .modal--show .modal-content {
    border-top: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
    background: #fff;
    padding: 8px 8px;
    font-size: 100%;
}
/*
.semantic-content footer, .modal--show footer {
    border-top: 1px solid #ffffff;
    padding: 4px 0 2px;
    background: #e8e8e8;
    border-radius: 2px;
}
*/

.semantic-content .modal-close, .modal--show .modal-close {
    display: block;
    height: 1px;
    clip: rect(0 0 0 0);
    margin: -1px;
    overflow: hidden;
}
.semantic-content .modal-close:focus:after, .modal--show .modal-close:focus:after {
    outline: 1px dotted;
    outline: -webkit-focus-ring-color auto 5px;
}
.semantic-content .modal-close:before, .modal--show .modal-close:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAEElEQVR42gEFAPr/AAAAAMwA0QDNTiUx4gAAAABJRU5ErkJggg==");
}
.semantic-content .modal-close:after, .modal--show .modal-close:after {
    content: '\00d7\00A0\9589\3058\308b';
    position: absolute;
    top: 7px;
    right: 50%;
    z-index: 20;
    margin-right: -159px;
    background: #e8e8e8;
    border-radius: 2px;
    padding: 8px 10px;
    text-decoration: none;
    text-indent: 0;
}
@media screen and (max-width: 480px) {
    .semantic-content .modal-inner, .modal--show .modal-inner {
        width: auto;
        margin: 0;
    }
    .semantic-content .modal-close:after, .modal--show .modal-close:after {
        margin-right: 0 !important;
        right: 0;
    }
    .semantic-content, .modal--show {
        -webkit-transform: translate(0, 400px);
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        -webkit-transition: opacity 1ms .25s;
        -moz-transition: opacity 1ms .25s;
        -o-transition: opacity 1ms .25s;
        -ms-transition: opacity 1ms .25s;
        transition: opacity 1ms .25s;
        display: block;
        bottom: auto;
    }
    .semantic-content:target, .modal--show:target, .is-active.semantic-content, .is-active.modal--show {
        height: 100%;
    }
    .semantic-content:before, .modal--show:before {
        content: '';
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 30;
    }
    .semantic-content .modal-inner, .modal--show .modal-inner {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        top: 0;
        left: 0;
        right: 0;
        height: 100%;
        overflow: auto;
    }
    .semantic-content .modal-content, .modal--show .modal-content {
        max-height: none;
        -ms-word-break: break-all;
        word-break: break-word;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        hyphens: auto;
    }
    .semantic-content .modal-close, .modal--show .modal-close {
        right: auto;
    }
    .semantic-content .modal-close:before, .modal--show .modal-close:before {
        display: none;
    }
    .semantic-content .modal-close:after, .modal--show .modal-close:after {
        top: 0px !important;
        left: auto;
        z-index: 40;
        margin-left: 0;
    }
}

@media screen and (min-width: 320px) {
    .semantic-content {
        -webkit-transition: opacity 0.4s;
        -o-transition: opacity 0.4s;
        transition: opacity 0.4s;
    }
}


/*	#modal
--------------------------------------------*/
.semantic-content .modal-content a {
    display: block;
    background: none;
    width: 206px;
    height: 45px;
    margin: 0 auto;
    margin-bottom: 8px;
    background-color: transparent;
    -webkit-touch-callout:none;
    -webkit-tap-highlight-color:rgba(0, 0, 0, 0);
}
.semantic-content .modal-content img.movie-button {
    display: block;
    width: 206px;
    height: 45px;
}

.modal-content ol {
    display: table;
    width: 100%;
    margin: 0 0 8px 0; }
    .modal-content ol li {
        display: table;
        list-style: none;
        margin: 0 auto; }
        .modal-content ol li dl {
            display: table;
            border-collapse: separate;
            border-spacing: 4px 2px; }
            .modal-content ol li dl dt,
            .modal-content ol li dl dd  {
                display: table-cell;
                vertical-align: middle; }
            .modal-content ol li dl dt  {
                text-align: center;
                background: #e8e8e8;
                width: 60px;
                padding: 4px 2px; }
                .modal-content ol li dl dd  {
                    padding: 4px 2px; }
                    .modal-content  ol li dl dd img{
                        vertical-align: middle; }