@charset "UTF-8";

@media only screen and (min-width: 320px) {

#header {
	background-image:url(../graphics/ht_jsp_23_photo_iotm_mob.png);
}
#main {
	background-color:#dbdbdb;
}
#lightbox {
	background-color:#fff;
}
#lightbox .gcell div {
	float:left;
}
#lightbox .gcell .caption {
	display:none;
}

#rightSpace .dropdown {
	background-color:#f0f0f0;
}

}


@media only screen and (min-width: 360px) {


}


@media only screen and (min-width: 481px) {

#lightbox {
	background-color:transparent;
}

}


@media only screen and (min-width: 640px) {

#header {
	background-image:url(../graphics/ht_jsp_23_photo.png);
}
#lightbox .gcell {
	width:100%;
	margin-bottom:1.5em;
}
#lightbox .gcell div:first-child {
	width:25%;
}
#lightbox .gcell .caption {
	width:75%;
	display:block;
	height:9.4em;
	margin-top:-0.1em;
	position:relative;
}
#lightbox .gcell .caption p {
	font-size:1em;
	line-height:1.6em;
	margin-left:2.5%;
}
#lightbox .gcell .caption .elip {
	position:absolute;
	right:0;
	width:3em;
	height:1.4em;
	top:8em;
	background-color:#dbdbdb;
	padding-left:0.5em;
}
#mainBlock .here {
	/* [disabled]margin-left:calc(4% + 1.25em); */
}
#nav .container {
	background-color: #dbdbdb;
}
#rightSpace .dropdown {
	background-color: #f0f0f0;
}

}


@media only screen and (min-width: 732px) {
	
#lightbox .gcell .caption {
	height:10.5em;
}
#lightbox .gcell .caption p {
	line-height:1.5em;
}
#lightbox .gcell .caption .elip {
	top:9.1em;
}

}


@media only screen and (min-width: 768px) {

#lightbox {
	width:88%;
	margin-left:6%;
	margin-top:1em;
}
#lightbox .gcell {
	margin-top:0;
	margin-bottom:2em;
	min-height:initial;
}
#lightbox .gcell:last-child {
	margin-bottom:0.5em;
}
#lightbox .gcell.vt {
	margin-top:-1em;
	margin-bottom:1em;
}
#lightbox .gcell.v2 {
	margin-top:0;
}
#lightbox .gcell.vt div:first-child,
#lightbox .gcell.sq div:first-child {
	background-position-x:100%;
}
#lightbox .gcell.vt .caption {
	margin-top:1em;
}
#lightbox .gcell div:first-child {
	width:22%;
}
#lightbox .gcell div:first-child::before {
	padding-top: 70%;
}
#lightbox .gcell.vt div:first-child::before,
#lightbox .gcell.sq div:first-child::before {
	padding-top: 100%;
}
#lightbox .gcell.aa div:first-child {
	background-size:cover;
}
#lightbox .gcell .caption {
	width:78%;
	height:7.2em;
	margin-top:0;
}
#lightbox .gcell .caption p {
	font-size:0.95em;
	line-height:1.6em;
	margin-left:3%;
	margin-right:0;
}
#lightbox .gcell .caption .elip {
	top:6em;
	right:0;
}
#rightSpace .dropdownInner div {
	font-size:1em;
}

}


@media only screen and (min-width: 961px) {

#mainBlock .intro p {
	border-left-color:#bbb;
}
#lightbox {
	width:calc(92% - 14px) !important;
	margin-left: calc(4% + 14px) !important;
}
#rightSpace .dropdown {
	background-color:transparent;
}

}


@media only screen and (min-width: 1025px) {

#lightbox {
	width: 90% !important;
	margin-left: calc(4% + 18px) !important;
}
#lightbox .gcell .caption {
	height:8.3em;
}
#lightbox .gcell .caption p {
	line-height:1.7em;
	margin-top:0.3em;
}
#lightbox .gcell .caption .elip {
	top:6.8em;
}

}


@media only screen and (min-width: 1081px) {
	

}


@media only screen and (min-width: 1201px) {
	

}


@media only screen and (min-width: 1281px) {


}


@media only screen and (min-width: 320px) and (max-width: 568px) and (orientation: landscape) {

#header {
	background-image:url(../graphics/ht_jsp_23_photo.png);
}
.topImg {
	display:none;
}
#mainBlock .here {
 	margin-left:calc(4% + 1.25em);
}
#lightbox {
	width:92%;
	margin-left:4%;
}
.intro p {
	margin-left:4%;
	margin-right:4%;
	margin-bottom:1.5em;
}
#lightbox .gcell {
	width:100%;
	margin-bottom:1em;
}
#lightbox .gcell div:first-child {
	width:25%;
}
#lightbox .gcell .caption {
	width:75%;
	display:block;
	height:8.4em;
	position:relative;
}
#lightbox .gcell .caption p {
	font-size:1em;
	line-height:1.4em;
	margin-left:2.5%;
}
#lightbox .gcell .caption .elip {
	position:absolute;
	right:0;
	width:3em;
	height:1.4em;
	top:6.9em;
	background-color:#dbdbdb;
	padding-left:0.5em;
}

}

@media screen and (-webkit-min-device-pixel-ratio:0) { 

}