@charset "UTF-8";
/* ============================================
	RESET
============================================= */
body, div,
dl, dt, dd, ul, ol, li,
h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, textarea,
p, blockquote, th, td,
address, caption, figure {
  margin: 0;
  padding: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

fieldset, img {
  border: 0;
  vertical-align: top;
}

address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
  font-weight: normal;
}

ul, ol {
  list-style: none;
}

caption, th {
  text-align: left;
}

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal;
}

q:before, q:after {
  content: '';
}

abbr, acronym {
  border: 0;
}

hr {
  display: none;
  margin: 0;
  padding: 0;
}

a {
  outline: none;
}

/*  clearfix */
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
  line-height: 0px;
}

.clearfix {
  zoom: 1;
}

/* ============================================
	FONT
============================================= */
body {
  font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
}

html {
  height: 100%;
}

body {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* ============================================
	COMMON
============================================= */
a {
  text-decoration: none;
}

#hidden_box {
  display: none;
}

.smt_br {
  display: none;
}

#ph_1 .photo1_1 {
  background-image: url(../images/top/top1_1.jpg) !important;
}

.section1 .movie_box .left_box {
  background: url(../images/conf/thumbnail01.jpg) center center no-repeat;
}

#ph_2 .photo2_1 {
  background-image: url(../images/top/top2_1.jpg) !important;
}

.section2 .movie_box .left_box {
  background: url(../images/conf/thumbnail02.jpg) center center no-repeat;
}

#ph_3 .photo3_1 {
  background-image: url(../images/top/top3_1.jpg) !important;
}

.section3 .movie_box .left_box {
  background: url(../images/conf/thumbnail03.jpg) center center no-repeat;
}

#ph_4 .photo4_1 {
  background-image: url(../images/top/top4_1.jpg) !important;
}

.section4 .movie_box .left_box {
  background: url(../images/conf/thumbnail04.jpg) center center no-repeat;
}

#ph_5 .photo5_1 {
  background-image: url(../images/top/top5_1.jpg) !important;
}

.section5 .movie_box .left_box {
  background: url(../images/conf/thumbnail05.jpg) center center no-repeat;
}

#ph_6 .photo6_1 {
  background-image: url(../images/top/top6_1.jpg) !important;
}

.section6 .movie_box .left_box {
  background: url(../images/conf/thumbnail06.jpg) center center no-repeat;
}

.section1 .movie_box .right_box {
  background: #000 url(../images/conf/movie01.png) center center no-repeat !important;
}

.section2 .movie_box .right_box {
  background: #000 url(../images/conf/movie02.png) center center no-repeat !important;
}

.section3 .movie_box .right_box {
  background: #000 url(../images/conf/movie03.png) center center no-repeat !important;
}

.section4 .movie_box .right_box {
  background: #000 url(../images/conf/movie04.png) center center no-repeat !important;
}

.section5 .movie_box .right_box {
  background: #000 url(../images/kitagawa/movie01.png) center center no-repeat !important;
}

#conf #visual_bg {
  background-image: url(../images/conf/ph01.png);
}

#interview #visual_bg {
  background-image: url(../images/interview/ph01.png);
}

#androidtv #visual_bg {
  background-image: url(../images/androidtv/ph01.png);
}

#gits #visual_bg {
  background-image: url(../images/gits/ph01.png);
}

#youtuber #visual_bg {
  background-image: url(../images/youtuber/ph01.png);
}

#kitagawa #visual_bg {
  background-image: url(../images/kitagawa/ph01.png);
}

.bn_7 .main_bg .change_photo {
  background-image: url(../images/top/top7.jpg) !important;
}

.bn_8 .main_bg .change_photo {
  background-image: url(../images/top/top8.jpg) !important;
}

.bn_9 .main_bg .change_photo {
  background-image: url(../images/top/top9.jpg) !important;
}

.bn_10 .main_bg .change_photo {
  background-image: url(../images/top/top10.jpg) !important;
}

@media screen and (min-width: 1025px) and (max-width: 1100px) {
  .small_banner .text_box h1 {
    font-size: 18px !important;
  }
  .small_banner .text_box h2 {
    font-size: 12px !important;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1200px) {
  .detail #detail_box {
    margin-left: 60px;
    margin-right: 60px;
  }

  #ph_1 .banner_title {
    font-size: 15px !important;
  }
}
@media screen and (min-width: 1025px) and (max-width: 1340px) {
  #top .bn_2 .text_box .copyright_col {
    margin-top: 5px !important;
  }
  #top .bn_2 .text_box h1 {
    font-size: 16px !important;
  }
}
@media screen and (max-width: 800px) {
  #ph_1 .bn_bg {
    background-image: url(../images/top/top1_1.jpg) !important;
    -webkit-background-size: cover cover;
    background-size: cover;
    background-position: center;
  }

  #ph_2 .bn_bg {
    background-image: url(../images/top/top2_1.jpg) !important;
    -webkit-background-size: cover cover;
    background-size: cover;
    background-position: center;
  }

  #ph_3 .bn_bg {
    background-image: url(../images/top/top3_1.jpg) !important;
    -webkit-background-size: cover cover;
    background-size: cover;
    background-position: center;
  }

  #ph_4 .bn_bg {
    background-image: url(../images/top/top4_1.jpg) !important;
    -webkit-background-size: cover cover;
    background-size: cover;
    background-position: center;
  }

  #ph_5 .bn_bg {
    background-image: url(../images/top/top5_1.jpg) !important;
    -webkit-background-size: cover cover;
    background-size: cover;
    background-position: center;
  }
}
@media screen and (min-width: 700px) and (max-width: 1024px) {
  .detail #movie_layer #video_container {
    width: 640px;
    height: 360px;
    margin: -180px 0 0 -320px;
  }

  .detail #movie_layer #video_container iframe {
    width: 640px;
    height: 360px;
  }
}
@media screen and (max-width: 699px) {
  .detail #movie_layer #video_container {
    width: 300px;
    height: 200px;
    margin: -100px 0 0 -150px;
  }

  .detail #movie_layer #video_container iframe {
    width: 300px;
    height: 200px;
  }
}
