@charset "utf-8";

/* Initialize
---------------------------------------------------------- */

#content.jp {
 width: 100%;
 font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka-等幅", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 font-size: 10px;
 line-height: 1.6;
 text-align: center;
 color: #000000;
}

.jp article, .jp aside, .jp dialog, .jp figure, .jp footer, .jp header, .jp hgroup, .jp nav, .jp section {
 display: block;
}

.jp h1, .jp h2, .jp h3, .jp h4, .jp h5, .jp h6, .jp th, .jp td, .jp caption {
 font-size: 1em;
 font-weight: normal;
}

.jp ul, .jp ol {
 list-style: none;
}

.jp img {
 border: 0;
 vertical-align: top;
}

.jp a {
 outline: none;
 text-decoration: none;
}

.jp a:link {
 color: #183e8d;
 text-decoration: underline;
}

.jp a:visited {
 color: #183e8d;
 text-decoration: underline;
}

.jp a:hover, .jp a:focus {
 color: #183e8d;
 text-decoration: none;
}

.jp a:active {
 color: #183e8d;
 text-decoration: none;
}

.jp address {
 font-style: normal;
}

.jp abbr, .jp acronym {
 border: 0;
}

.jp label {
 cursor: pointer;
}

.jp table {
 font-size: 1em;
 line-height: 1.4;
 border-collapse: collapse;
 border-spacing: 0;
}

/* Utilities
---------------------------------------------------------- */

.jp .xx-broad {
 letter-spacing: 3px;
}

.jp .x-broad {
 letter-spacing: 2px;
}

.jp .broad {
 letter-spacing: 1px;
}

.jp .indent {
 padding-left: 1em;
 text-indent: -1em;
}

.jp .marker {
 color: #243d7a;
}

/* Index Layout
---------------------------------------------------------- */

.jp #index #content-header,
.jp #index #content-footer {
 margin: 0 auto;
 width: 950px;
 text-align: left;
}

/* content-header --------------------------------- */

/* summary */

.jp #index #content-header #summary {
 margin-bottom: 21px;
 width: 946px;
 border: #8b9ec6 solid 2px;
 overflow: hidden;
}

.jp #index #content-header #summary-header,
.jp #index #content-header #summary-content,
.jp #index #content-header .summary-item-txt {
 margin: 0;
 padding: 0;
}

.jp #index #content-header #summary-header,
.jp #index #content-header #summary-content {
 float: left;
}

.jp #index #content-header #summary-header {
 margin-right: 15px;
}

.jp #index #content-header #summary-content {
 margin-top: 20px;
}

.jp #index #content-header .summary-item-txt {
 padding: 10px 0;
 font-size: 1.3em;
}

/* video */

.jp #index #content-header #video {
 margin-bottom: 30px;
 width: 950px;
 height: 390px;
 overflow: hidden;
}

.jp #index #content-header #video-player {
 width: 640px;
 float: left;
}

.jp #index #content-header #video-list {
 width: 290px;
 height: 375px;
 border-bottom: #193e8e solid 15px;
 float: right;
}

.jp #index #content-header #video-list-header,
.jp #index #content-header #video-list-content,
.jp #index #content-header #video-list-content-inner,
.jp #index #content-header .video-list-item {
 margin: 0;
 padding: 0;
}

.jp #index #content-header #video-list-header {
 height: 32px;
}

.jp #index #content-header #video-list-content {
 padding-top: 10px;
 width: 288px;
 height: 332px;
 border-left: #cccccc solid 1px;
 border-right: #cccccc solid 1px;
 overflow-y: scroll;
}

.jp #index #content-header #video-list-content-inner {
 padding: 5px;
}

.jp #index #content-header .video-list-item {
 margin-bottom: 10px;
 padding: 5px;
 display: block;
 overflow: hidden;
 cursor: pointer;
 -webkit-border-radius: 2px;
 -moz-border-radius: 2px;
 border-radius: 2px;
}

.jp #index #content-header .video-list-item:hover {
 background: #e8ebf3;
}

.jp #index #content-header .video-thumb,
.jp #index #content-header .video-data {
 display: block;
 float: left;
}

.jp #index #content-header .video-thumb {
 margin-right: 8px;
 width: 106px;
 line-height: 0;
}

.jp #index #content-header .video-thumb img {
 -webkit-border-radius: 2px;
 -moz-border-radius: 2px;
 border-radius: 2px;
}

.jp #index #content-header .video-data,
.jp #index #content-header .video-title,
.jp #index #content-header .video-option {
 width: 137px;
 line-height: 1.3;
 display: block;
}

.jp #index #content-header .video-option {
 font-size: 1.1em;
}

.jp #index #content-header .video-title {
 margin-bottom: 4px;
 font-size: 1.2em;
 font-weight: bold;
 color: #0453a0;
}

.jp #index #content-header .video-author {
 color: #0453a0;
}

/* content-body --------------------------------- */

.jp #index #content-body {
 margin-bottom: 15px;
 padding: 25px 0 25px 0;
 text-align: left;
 background: #ebe5dc;
}

.jp #index #content-body .section {
 position: relative;
 margin: 0 auto 10px auto;
 width: 950px;
 line-height: 1.8;
 background: #ffffff;
 -webkit-border-radius: 3px;
 -moz-border-radius: 3px;
 border-radius: 3px;
}

.jp #index #content-body #section-01 {
 margin-bottom: 20px;
 -webkit-border-radius: 0;
 -moz-border-radius: 0;
 border-radius: 0;
}

.jp #index #content-body .section-header,
.jp #index #content-body .section-content,
.jp #index #content-body .section-item-title,
.jp #index #content-body .section-item-txt,
.jp #index #content-body .section-item-figure,
.jp #index #content-body .section-item-txt-header,
.jp #index #content-body .section-item-txt-body {
 margin: 0;
 padding: 0;
}

.jp #index #content-body #section-01 .section-header {
 margin: 0 5px;
 padding: 5px 0 3px 0;
 line-height: 0;
 border-bottom: #a7b1c9 solid 1px;
}

.jp #index #content-body .section-content {
 margin: 0 15px;
 padding: 30px 0;
 letter-spacing: -1em;
 word-spacing: -1em;
}

.jp #index #content-body #section-01 .section-content {
 margin-top: 20px;
 padding: 0 0 20px 0;
 border-bottom: #d7dcea solid 2px;
}

.jp #index #content-body #section-01 .section-content.last {
 border: 0;
}

.jp #index #content-body .section-item-title,
.jp #index #content-body .section-item-txt,
.jp #index #content-body .section-item-figure {
 font-size: 1.2em;
 vertical-align: middle;
 letter-spacing: normal;
 word-spacing: normal;
 display: inline-block;
}

*:first-child+html .jp #index #content-body .section-item-title,
*:first-child+html .jp #index #content-body .section-item-txt,
*:first-child+html .jp #index #content-body .section-item-figure {
 height: 1%;
 display: inline;
}

.jp #index #content-body #section-01 .section-item-title,
.jp #index #content-body #section-01 .section-item-txt {
 vertical-align: top;
}

.jp #index #content-body .section-item-title {
 width: 235px;
}

.jp #index #content-body .section-item-txt {
 width: 684px;
 text-align: justify;
 text-justify: distribute;
 word-wrap: break-word;
}

.jp #index #content-body dl.section-item-txt {
 letter-spacing: -1em;
 word-spacing: -1em;
}

.jp #index #content-body .section-item-txt-header,
.jp #index #content-body .section-item-txt-body {
 vertical-align: top;
 letter-spacing: normal;
 word-spacing: normal;
 display: inline-block;
}

*:first-child+html .jp #index #content-body .section-item-txt-header,
*:first-child+html .jp #index #content-body .section-item-txt-body {
 height: 1%;
 display: inline;
}

.jp #index #content-body .section-item-txt-header {
 width: 87px;
 font-weight: bold;
}

.jp #index #content-body .section-item-txt-body {
 margin-bottom: 20px;
}

.jp #index #content-body .section-item-txt-body.last {
 margin-bottom: 0;
}

.jp #index #content-body .section-item-link:link    { text-decoration: underline; }
.jp #index #content-body .section-item-link:visited { text-decoration: underline; }
.jp #index #content-body .section-item-link:hover   { text-decoration: none; }
.jp #index #content-body .section-item-link:active  { text-decoration: none; }

.jp #index #content-body #section-06 .indent {
 padding-left: 1.4em;
 text-indent: -1.4em;
}

/* layout-tw */

.jp #index #content-body .layout-tw .section-item-txt {
 width: 684px;
}

.jp #index #content-body .layout-tw .section-item-txt-body {
 width: 597px;
}

/* layout-twt */

.jp #index #content-body .section-item.layout-twt {
 padding: 20px 15px 10px 15px;
}

.jp #index #content-body .layout-twt .section-item-txt {
 width: 512px;
}

.jp #index #content-body .layout-twt .section-item-txt-body {
 width: 425px;
}

.jp #index  #content-body.layout-twt .section-item-figure {
 width: 171px;
}

/* content-footer --------------------------------- */

.jp #index #content-footer {
 margin: 0 auto;
 width: 950px;
}

.jp #index #content-footer .go2top {
 text-align: right;
}

/* About Layout
---------------------------------------------------------- */

.jp #about {
 margin: 0 auto;
 width: 641px;
 text-align: left;
 line-height: 1.8;
}

/* content-head --------------------------------- */

.jp #about #content-header {
 margin-top: 15px;
 font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka-等幅", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 font-size: 10px;
 line-height: 1.8;
 text-align: left;
 color: #000000;
 height: 1%;
 overflow: hidden;
}

.jp #about #content-header #summary {
 margin: 0;
 padding: 0;
 text-align: left;
}

/* content-body --------------------------------- */

.jp #about #content-body {
 margin-top: 19px;
}

.jp #about #content-body .section {
 margin-top: 65px;
}

.jp #about #content-body .section-header,
.jp #about #content-body .section-content,
.jp #about #content-body .section-item-title,
.jp #about #content-body .section-item-txt {
 margin: 0;
 padding: 0;
}

.jp #about #content-body #section-01 {
 margin-top: 0;
}

.jp #about #content-body .section-content {
 margin: 0 16px 0 18px;
}

.jp #about #content-body .section-item-title {
 margin: 25px 0 0 0;
 padding: 0;
 width: 100%;
 line-height: 1.4;
 font-size: 1.4em;
 font-weight: bold;
 color: #183e8d;
}

.jp #about #content-body .section-item-txt {
 margin-top: 15px;
 font-size: 1.2em;
 text-align: justify;
 text-justify: distribute;
 word-wrap: break-word;
}

/* content-footer --------------------------------- */

.jp #about #content-footer {
 margin-top: 60px;
 padding: 0 16px 0 18px;
 text-align: left;
 border-top: #d7dcea solid 2px;
}

.jp #about #content-footer .contact-header {
 margin: 30px 0 15px 0;
 font-size: 1.4em;
 font-weight: bold;
 color: #183e8d;
}

.jp #about #content-footer .contact {
 margin: 0;
 padding: 0;
 vertical-align: top;
 display: inline-block;
 /display: inline;
 /zoom: 1;
}

.jp #about #content-footer #contact-01 {
 width: 290px;
}

.jp #about #content-footer #contact-02 {
 width: 310px;
}

.jp #about #content-footer .contact dt,
.jp #about #content-footer .contact dd {
 margin: 0;
 padding: 0;
 font-size: 1.2em;
}

.jp #about #content-footer .go2top {
 margin: 65px 0 0 0;
 padding: 0;
 text-align: right;
}