@charset "utf-8";

/* toggleList ++++++++++++++++++++++++++++++++++
++++++++++++++++++++++++++++++++++++++++++++++++ */

#prefList{
	margin-bottom:30px;
	padding:0 0 6px;
}
.toggleList{
	clear:both;
	overflow:hidden;
	border-bottom:1px solid #bbb;
	font-size:16px;
}

.toggleList dt{
	display:block;
	padding:16px 36px 18px 8px;
	line-height:1;
	color:#011b8f;

	-ms-text-overflow:ellipsis;
	text-overflow:ellipsis;
	white-space: nowrap;
	overflow:hidden;

	cursor:pointer;
	position:relative;
	font-weight:bold;
}

.toggleList dt:before{
	content:"";
	display:block;
	width:14px;
	height:14px;
	border:1px solid #bbb;
	position:absolute;
	right:10px;
	top:16px;
	z-index:10;
}
.toggleList dt:first-child{
	border:none;
}


.toggleList dt:after{
	display:block;
	content:"";
	position:absolute;
	right:13px;
	top:20px;
	width:0;
	height:0;
	border-style:solid;
	border-width:8px 5px 0 5px;
	border-color:#ababab transparent transparent transparent;
}

.toggleList dt.active:after{
	border-width: 0 5px 8px 5px;
	border-color: transparent transparent #ababab transparent;
}

.toggleList > dt{ border-top:1px solid #bbb; }
.toggleList dd{ padding:0 6px 10px; }

.toggleList dd > p{ padding:10px 0 16px; text-align:right; }
.toggleList dd > p:first-child,
.toggleList dd > p#dolby-atmos{
    padding:0 0 10px;text-align:left;
}

.toggleList dd p a{ text-decoration:underline; }


.toggleList dl{
	border:1px solid #bbb;
	background:#fff;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
}
.toggleList dl dt{ border-top:1px solid #bbb;}
.toggleList dl dt:first-child { border-top:none;}

.toggleList dt.active + dd dl{ background:#eee; }

#prefList table{
	width:100%;
	margin-bottom:16px;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;

	padding:6px;
	background:#eee;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
}

#prefList caption{
	font-size:16px;
	padding-bottom:4px;
	text-align:left;
	font-weight:bold;
}


#prefList td{
	width:33.33%;
	padding:1px;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	border-width:1px 1px 1px 1px;
	border-style:solid;
	border-color:#fff #ccc #ccc #fff;
	text-align:center;
	font-weight:bold;
	vertical-align:middle;
}

#prefList td a{
	display:block;
	margin:2px;
	padding:10px 2px;
	color:#001b8f;
}


#prefList td:first-child { border-left:none;}
#prefList td:last-child { border-right:none;}
#prefList tr:first-child td{ border-top:none; }
#prefList tr:last-child td{ border-bottom:none; }

#prefList.theater .toggleList dd{
  visibility: hidden;
  padding: 0 10px 0px;
  height: 0px;
  opacity: 0;
  transition: 0.1s;
}

#prefList.theater .toggleList dd.visible{
  visibility: visible;
  padding: 0 10px 10px;
  border-bottom: 1px solid #bbb;
  height: initial;
  opacity: 1;
  transition: 0.5s;
}


ul.linkList {
  margin-top:1px;
  font-size:16px;
  border-bottom:1px solid #bbb;
}
ul.linkList li{
  font-weight:bold;
  overflow:hidden;
  background-color:#fff;
}
ul.linkList a{
  display:block;
  padding:14px 26px 12px 8px;
  overflow:hidden;
  cursor:pointer;
  color:#000;
}
ul.linkList a[href]{
  color:#011b8f;
  background:url(../../images/smartphone/icon_linkarrow.png) no-repeat right center;
  background-size:auto 16px;
}

#imaxArea h2 {
    background: #003A73;
    color: #fff;
    text-align: center;
    padding: 10px 0;
}

#imaxArea .imaxBox {
    margin-bottom: 20px;
}

#imaxArea .imaxBox .homeSliderWrapper .bx-wrapper {
    margin-bottom: 0;
    box-shadow: none;
}

#imaxArea .imaxBox .homeSliderWrapper ul {
    display: flex;
    margin: 0 auto;
}

#imaxArea .imaxBox .homeSliderWrapper ul li {
    width: 32%;
    margin-right: 2%;
    height: auto;
    display: none;
}

#imaxArea .imaxBox .homeSliderWrapper .bx-viewport ul li {
    display: block;
}

#imaxArea .imaxBox .homeSliderWrapper ul li:last-of-type {
    margin-right: 0;
}

#imaxArea .imaxBox .homeSliderWrapper ul li a {
    display: block;
    overflow: hidden;
    width: 100%;
}


#imaxArea .imaxBox .homeSliderWrapper ul li a img {
    width: 100%;
    height: auto;
    margin-bottom: 4px;
}

#imaxArea .imaxBox .homeSliderWrapper ul li a span {
    color: #555555;
    font-size: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;
    width: 100%;
}

#imaxArea .toggleList dd {
    padding: 0;
}

#imaxArea .toggleList dd h3 {
    background: #A1A1A1;
    color: #fff;
    padding: 10px;
}

#imaxArea .toggleList dd .theaterList {
    padding: 0;
}

#imaxArea .toggleList dd .theaterList>li {
    padding: 10px 6px;
    border-bottom: solid 1px #bbb;
}

#imaxArea .toggleList dd .theaterList>li:last-of-type {
    border-bottom: none;
}

#imaxArea .toggleList dd .theaterList>li>a {
    display: flex;
    padding: 0 0 10px;
}


#imaxArea .toggleList dd .theaterList>li>a>span:first-of-type {
    display: block;
    content: "";
    width: 16px;
    height: 16px;
    left: 6px;
    top: 4px;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 10px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    line-height: 1.6;
    border: 1px solid #a71a1a;
    -webkit-box-shadow: inset 0px 0px 1px 0 #fff;
    -moz-box-shadow: inset 0px 0px 1px 0 #fff;
    box-shadow: inset 0px 0px 1px 0 #fff;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    background: #de3333;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f44a4a), to(#cb2222));
    background-image: -moz-linear-gradient(top, #f44a4a, #cb2222);
    background-image: -ms-linear-gradient(top, #f44a4a, #cb2222);
    background-image: -o-linear-gradient(top, #f44a4a, #cb2222);
    background-image: linear-gradient(top, #f44a4a, #cb2222);
}

#imaxArea .toggleList dd .theaterList>li>a>span:last-of-type {
    display: block;
    padding-left: 6px;

}

#imaxArea .toggleList dd .theaterList>li>a>span:last-of-type h4 {
    color: #000;
}

#imaxArea .toggleList dd .theaterList>li>a>span:last-of-type>span {
    display: block;
    font-size: 11px;
    color: #555;
}

#imaxArea .toggleList dd .theaterList li .nowTheater ul {
    display: flex;
    scroll-snap-type: x mandatory;
    white-space: nowrap;
    overflow-x: auto;
}

#imaxArea .toggleList dd .theaterList li .nowTheater ul li a {
    width: 90px;
    display: block;
    margin: 0 1px 0 0
}

#imaxArea .toggleList dd .theaterList li .nowTheater ul li a span {
    display: block;
}

#imaxArea .toggleList dd .theaterList li .nowTheater ul li a span:first-of-type {
    margin-bottom: 5px;
}

#imaxArea .toggleList dd .theaterList li .nowTheater ul li a span:first-of-type img {
    width: 100%;
    height: auto;
}

#imaxArea .toggleList dd .theaterList li .nowTheater ul li a span:last-of-type {
    font-size: 10px;
    color: #555;
    display: block;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
}

