@charset "utf-8";

/* header
--------------------------------------------------------- */
header#header {
	background: url(/site_transino/common/images/header/background-01.png) 0 100% repeat-x;
	height: 73px;
}

/* 640px */
@media screen and (max-width: 640px) {
	header#header {
		height: 59px;
	}
}

/* slider
--------------------------------------------------------- */
section.slider-block-1 {
	margin-top: 73px;
	position: relative;
	height: 567px;
	overflow: hidden;
}
section.slider-block-1 ul {
	height: 500px;
	overflow: hidden;
}
section.slider-block-1 ul li {
	background-position: 0 0;
	background-repeat: no-repeat;
	height: 500px;
	width: 1040px;
}
section.slider-block-1 ul li.item-1 {
	background-image: url(/site_transino/images/index/slider-block-1-image-01-pc.jpg);
	position: relative;
}
section.slider-block-1 ul li.item-2 {
	background-image: url(/site_transino/images/index/slider-block-1-image-02-pc.jpg);
}
section.slider-block-1 ul li.item-3 {
	background-image: url(/site_transino/images/index/slider-block-1-image-03-pc.jpg);
}
section.slider-block-1 ul li.item-4 {
	background-image: url(/site_transino/images/index/slider-block-1-image-04-pc.jpg);
}
section.slider-block-1 ul li.item-5 {
	background-image: url(/site_transino/images/index/slider-block-1-image-05-pc.jpg);
}
section.slider-block-1 ul li.item-6 {
	background-image: url(/site_transino/images/index/slider-block-1-image-06-pc.jpg);
}
section.slider-block-1 ul li.item-5 #sp_main{
	display:none;
}
section.slider-block-1 ul li a {
	display: block;
	height: 500px;
	width: 1040px;
}
section.slider-block-1 ul li a.banner-pc {
	background: url(/site_transino/common/images/banner/button-01-pc.png) 0 0 no-repeat;
	display: block;
    height: 53px;
    left: 303px;
    position: absolute;
    top: 379px;
    width: 170px;
    overflow: hidden;
    text-indent: -9999px;
}
section.slider-block-1 .bx-wrapper .bx-viewport {
	width: 1040px !important;
}
section.slider-block-1 .bx-wrapper .bx-controls {
	width: 1040px;
}
section.slider-block-1 .bx-wrapper .bx-controls .bx-pager {
	bottom: 6px;
}
section.slider-block-1 p.text {
	background-color: #444;
	font-size: 0;
	line-height: 0;
	padding-bottom: 24px;
	padding-top: 25px;
	text-align: center;
}

/* 768px */
@media screen and (max-width: 768px) {
	section.slider-block-1 {
		height: 567px;
	}
	section.slider-block-1 ul li {
		width: 768px;
	}
	section.slider-block-1 ul li.item-1 {
		background-image: url(/site_transino/images/index/slider-block-1-image-01-tb.jpg);
	}
	section.slider-block-1 ul li.item-2 {
		background-image: url(/site_transino/images/index/slider-block-1-image-02-tb.jpg);
	}
	section.slider-block-1 ul li.item-3 {
		background-image: url(/site_transino/images/index/slider-block-1-image-03-tb.jpg);
	}
	section.slider-block-1 ul li.item-4 {
		background-image: url(/site_transino/images/index/slider-block-1-image-04-tb.jpg);
	}
	section.slider-block-1 ul li.item-5 {
		background-image: url(/site_transino/images/index/slider-block-1-image-05-tb.jpg);
	}
	section.slider-block-1 ul li.item-6 {
		background-image: url(/site_transino/images/index/slider-block-1-image-06-tb.jpg);
	}
	section.slider-block-1 ul li a {
		width: 768px;
	}
	section.slider-block-1 ul li a.banner-pc {
		background-image: url(/site_transino/common/images/banner/button-01-tb.png);
		left: 250px;
		top: 366px;
		height: 66px;
		width: 138px;
	}
	section.slider-block-1 .bx-wrapper .bx-viewport {
		width: 768px !important;
	}
	section.slider-block-1 .bx-wrapper .bx-controls {
		width: 768px;
	}
	section.slider-block-1 .bx-wrapper .bx-controls .bx-controls-direction {
		display: none;
	}
}

/* 640px */
@media screen and (max-width: 640px) {
	section.slider-block-1 {
		margin-top: 59px;
		height: 354px;
	}
	section.slider-block-1 ul {
		height: auto;
	}
	section.slider-block-1 ul li {
		background-size: 320px 320px;
		height: 320px;
		width: 320px;
	}
	section.slider-block-1 ul li.item-1 {
		background-image: url(/site_transino/images/index/slider-block-1-image-01-sp.jpg);
	}
	section.slider-block-1 ul li.item-2 {
		background-image: url(/site_transino/images/index/slider-block-1-image-02-sp.jpg);
	}
	section.slider-block-1 ul li.item-3 {
		background-image: url(/site_transino/images/index/slider-block-1-image-03-sp.jpg);
	}
	section.slider-block-1 ul li.item-4 {
		background-image: url(/site_transino/images/index/slider-block-1-image-04-sp.jpg);
	}
	section.slider-block-1 ul li.item-5 {
		background-image: url(/site_transino/images/index/slider-block-1-image-05-sp.jpg);
	}
	section.slider-block-1 ul li.item-6 {
		background-image: url(/site_transino/images/index/slider-block-1-image-06-sp.jpg);
	}
	section.slider-block-1 ul li.item-5 #pc_main{
		display:none;
	}
	section.slider-block-1 ul li.item-5 #sp_main{
		display:block;
	}
	section.slider-block-1 ul li a {
		height: 320px;
		width: 320px;
	}
	section.slider-block-1 ul li a.banner-pc {
		display: none;
	}
	section.slider-block-1 .bx-wrapper .bx-viewport {
		height: 320px !important;
		width: 320px !important;
	}
	section.slider-block-1 .bx-wrapper .bx-controls {
		width: 320px;
	}
	section.slider-block-1 .bx-wrapper .bx-controls .bx-pager {
		bottom: 3px;
	}
	section.slider-block-1 p.text {
		padding-bottom: 12px;
		padding-top: 12px;
	}
	section.slider-block-1 p.text img {
		height: 9px;
		width: 296px;
	}
}

/* banner-sp
--------------------------------------------------------- */
section.banner-sp {
	display: none;
}

/* 640px */
@media screen and (max-width: 640px) {
	section.banner-sp {
		background: #f9f9f9 url(/site_transino/common/images/banner/background-01-sp.png) 0 100% repeat-x;
		background-size: 1px;
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 320px;
	}
	section.banner-sp p {
		padding-bottom: 11px;
		padding-top: 9px;
		text-align: center;
	}
	section.banner-sp p img {
		width: 260px;
	}
}

/* content
--------------------------------------------------------- */
section#content div.content-inner {
	margin-top: 0;
}

/* 640px */
@media screen and (max-width: 640px) {
	section#content div.content-inner {
		margin-top: 0;
	}
}

/* title-block-1
--------------------------------------------------------- */
section#content section.title-block-1 {
}
section#content section.title-block-1 h1 {
	display: none;
}

/* block-1
--------------------------------------------------------- */
section#content section.block-1 {
}
section#content section#block-1 h2 {
	font-size: 0;
	line-height: 0;
	margin-top: 61px;
	text-align: center;
}

/* 768px */
@media screen and (max-width: 768px) {
}

/* 640px */
@media screen and (max-width: 640px) {
	section#content section#block-1 h2 {
		margin-top: 30px;
	}
	section#content section#block-1 h2 img {
		height: 18px;
		width: 184px;
	}
}

/* recommend-index-block-1
--------------------------------------------------------- */
section#content section#recommend-index-block-1 {
}
section#content section#recommend-index-block-1 h3 {
	background: url(/site_transino/images/index/recommend-index-block-1-h3-01-pc.png) 0 0 no-repeat;
	height: 40px;
	margin-top: 60px;
	width: 980px;
	overflow: hidden;
	position: relative;
	text-indent: -9999px;
}
section#content section#recommend-index-block-1 div.table {
	margin-top: 20px;
}
section#content section#recommend-index-block-1 p.button a {
	height: 63px;
	display: block;
	width: 310px;
	overflow: hidden;
	position: relative;
	text-indent: -9999px;
}
section#content section#recommend-index-block-1 p.image {
	border: 1px solid #ddd;
	-moz-box-shadow: 0 1px 0 rgba(0,0,0,.05);
	-webkit-box-shadow: 0 1px 0 rgba(0,0,0,.05);
	box-shadow: 0 1px 0 rgba(0,0,0,.05);
	height: 277px;
	padding-bottom: 9px;
	padding-top: 11px;
	width: 308px;
	overflow: hidden;
	position: relative;
	text-indent: -9999px;
}
section#content section#recommend-index-block-1 div.table div.cell-1 {
	padding-right: 25px;
}
section#content section#recommend-index-block-1 div.table div.cell-1 p.button a {
	background: url(/site_transino/images/index/recommend-index-block-1-button-01-pc.png) 0 0 no-repeat;
}
section#content section#recommend-index-block-1 div.table div.cell-1 p.button a:hover {
	background-position: 0 -63px;
}
section#content section#recommend-index-block-1 div.table div.cell-1 p.image {
	background: url(/site_transino/images/index/recommend-index-block-1-image-01-pc.jpg) 50% 11px no-repeat;
}
section#content section#recommend-index-block-1 div.table div.cell-2 {
	padding-right: 25px;
}
section#content section#recommend-index-block-1 div.table div.cell-2 p.button a {
	background: url(/site_transino/images/index/recommend-index-block-1-button-02-pc.png) 0 0 no-repeat;
}
section#content section#recommend-index-block-1 div.table div.cell-2 p.button a:hover {
	background-position: 0 -63px;
}
section#content section#recommend-index-block-1 div.table div.cell-2 p.image {
	background: url(/site_transino/images/index/recommend-index-block-1-image-02-pc.jpg) 50% 11px no-repeat;
}
section#content section#recommend-index-block-1 div.table div.cell-3 {
}
section#content section#recommend-index-block-1 div.table div.cell-3 p.button a {
	background: url(/site_transino/images/index/recommend-index-block-1-button-03-pc.png) 0 0 no-repeat;
}
section#content section#recommend-index-block-1 div.table div.cell-3 p.button a:hover {
	background-position: 0 -63px;
}
section#content section#recommend-index-block-1 div.table div.cell-3 p.image {
	background: url(/site_transino/images/index/recommend-index-block-1-image-03-pc.jpg) 50% 11px no-repeat;
}
section#content section#recommend-index-block-1 div.table div.cell-3 p.note{
	background: url(/site_transino/images/index/recommend-index-block-1-text-03-pc.png) 0 0 no-repeat;
	height: 41px;
    width: 308px;
	margin-top: 10px;
	text-indent: -9999px;
	position: relative;
	overflow: hidden;
}

/* 768px */
@media screen and (max-width: 768px) {
	section#content section#recommend-index-block-1 h3 {
		background-image: url(/site_transino/images/index/recommend-index-block-1-h3-01-tb.png);
		width: 728px;
	}
	section#content section#recommend-index-block-1 p.button a {
		width: 236px;
	}
	section#content section#recommend-index-block-1 p.image {
		height: 272px;
		padding-bottom: 9px;
		padding-top: 16px;
		width: 234px;
	}
	section#content section#recommend-index-block-1 div.table div.cell-1 {
		padding-right: 10px;
	}
	section#content section#recommend-index-block-1 div.table div.cell-1 p.button a {
		background-image: url(/site_transino/images/index/recommend-index-block-1-button-01-tb.png);
	}
	section#content section#recommend-index-block-1 div.table div.cell-1 p.image {
		background-image: url(/site_transino/images/index/recommend-index-block-1-image-01-tb.jpg);
	}
	section#content section#recommend-index-block-1 div.table div.cell-2 {
		padding-right: 10px;
	}
	section#content section#recommend-index-block-1 div.table div.cell-2 p.button a {
		background-image: url(/site_transino/images/index/recommend-index-block-1-button-02-tb.png);
	}
	section#content section#recommend-index-block-1 div.table div.cell-2 p.image {
		background-image: url(/site_transino/images/index/recommend-index-block-1-image-02-tb.jpg);
	}
	section#content section#recommend-index-block-1 div.table div.cell-3 p.button a {
		background-image: url(/site_transino/images/index/recommend-index-block-1-button-03-tb.png);
	}
	section#content section#recommend-index-block-1 div.table div.cell-3 p.image {
		background-image: url(/site_transino/images/index/recommend-index-block-1-image-03-tb.jpg);
	}
	section#content section#recommend-index-block-1 div.table div.cell-3 p.note{
		background: url(/site_transino/images/index/recommend-index-block-1-text-03-tb.png) center no-repeat;
		background-size: 224px auto;
		height: 41px;
	    width: 234px;
		margin-top: 10px;
	}
}

/* 640px */
@media screen and (max-width: 640px) {
	section#content section#recommend-index-block-1 {
	}
	section#content section#recommend-index-block-1 h3 {
		background: url(/site_transino/images/index/recommend-index-block-1-h3-01-sp.png) 0 0 no-repeat;
		background-size: 300px;
		height: 46px;
		margin-top: 30px;
		width: 300px;
	}
	section#content section#recommend-index-block-1 div.table {
		margin-top: 10px;
	}
	section#content section#recommend-index-block-1 div.table div.tc {
		display: block;
	}
	section#content section#recommend-index-block-1 p.button a {
		height: 50px;
		display: block;
		width: 300px;
	}
	section#content section#recommend-index-block-1 p.image {
		height: 170px;
		padding-bottom: 0;
		padding-top: 0;
		width: 298px;
	}
	section#content section#recommend-index-block-1 div.table div.cell-1 {
		padding-right: 0;
	}
	section#content section#recommend-index-block-1 div.table div.cell-1 p.button a {
		background-image: url(/site_transino/images/index/recommend-index-block-1-button-01-sp.png);
		background-size: 300px;
	}
	section#content section#recommend-index-block-1 div.table div.cell-1 p.button a:hover {
		background-position: 0 -50px;
	}
	section#content section#recommend-index-block-1 div.table div.cell-1 p.image {
		background: url(/site_transino/images/index/recommend-index-block-1-image-01-sp.jpg) 50% 7px no-repeat;
		background-size: 293px;
	}
	section#content section#recommend-index-block-1 div.table div.cell-2 {
		margin-top: 15px;
		padding-right: 0;
	}
	section#content section#recommend-index-block-1 div.table div.cell-2 p.button a {
		background-image: url(/site_transino/images/index/recommend-index-block-1-button-02-sp.png);
		background-size: 300px;
	}
	section#content section#recommend-index-block-1 div.table div.cell-2 p.button a:hover {
		background-position: 0 -50px;
	}
	section#content section#recommend-index-block-1 div.table div.cell-2 p.image {
		background: url(/site_transino/images/index/recommend-index-block-1-image-02-sp.jpg) 50% 7px no-repeat;
		background-size: 293px;
	}
	section#content section#recommend-index-block-1 div.table div.cell-3 {
		margin-top: 15px;
	}
	section#content section#recommend-index-block-1 div.table div.cell-3 p.button a {
		background-image: url(/site_transino/images/index/recommend-index-block-1-button-03-sp.png);
		background-size: 300px;
	}
	section#content section#recommend-index-block-1 div.table div.cell-3 p.button a:hover {
		background-position: 0 -50px;
	}
	section#content section#recommend-index-block-1 div.table div.cell-3 p.image {
		background: url(/site_transino/images/index/recommend-index-block-1-image-03-sp.jpg) 50% 7px no-repeat;
		background-size: 293px;
	}
	section#content section#recommend-index-block-1 div.table div.cell-3 p.note{
		background: url(/site_transino/images/index/recommend-index-block-1-text-03-sp.png) left no-repeat;
		background-size: 248px auto;
		height: 33px;
	    width: 248px;
		margin-left: 5px;
	}
}

/* block-2
--------------------------------------------------------- */
section#content section#block-2 {
	background: url(/site_transino/images/index/block-2-image-01-pc.png) 0 0 no-repeat;
	height: 320px;
	margin-top: 50px;
	padding-left: 52px;
	padding-right: 52px;
	padding-top: 603px;
	width: 880px;
}
section#content section#block-3 ul {
}
section#content section#block-3 ul:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}
section#content section#block-2 ul li {
	float: left;
	overflow: hidden;
	position: relative;
	text-indent: -9999px;
}
section#content section#block-2 ul li a {
	display: block;
	height: 233px;
	width: 271px;
}
section#content section#block-2 ul li.item-1 a {
	background: url(/site_transino/images/index/block-2-button-01-pc.png) 0 0 no-repeat;
	padding-right: 32px;
}
section#content section#block-2 ul li.item-2 a {
	background: url(/site_transino/images/index/block-2-button-02-pc.png) 0 0 no-repeat;
	padding-right: 32px;
}
section#content section#block-2 ul li.item-3 a {
	background: url(/site_transino/images/index/block-2-button-03-pc.png) 0 0 no-repeat;
}
section#content section#block-2 ul li a:hover {
	background-position: 0 -233px;
}

/* 768px */
@media screen and (max-width: 768px) {
	section#content section#block-2 {
		background-image: url(/site_transino/images/index/block-2-image-01-tb.png);
		height: 325px;
		margin-left: -6px;
		padding-left: 24px;
		padding-right: 18px;
		padding-top: 574px;
		width: 698px;
	}
	section#content section#block-2 ul li a {
		height: 234px;
		width: 210px;
	}
	section#content section#block-2 ul li.item-1 a {
		background: url(/site_transino/images/index/block-2-button-01-tb.png) 0 0 no-repeat;
	}
	section#content section#block-2 ul li.item-2 a {
		background: url(/site_transino/images/index/block-2-button-02-tb.png) 0 0 no-repeat;
	}
	section#content section#block-2 ul li.item-3 a {
		background: url(/site_transino/images/index/block-2-button-03-tb.png) 0 0 no-repeat;
	}
	section#content section#block-2 ul li a:hover {
		background-position: 0 -234px;
	}
}

/* 640px */
@media screen and (max-width: 640px) {
	section#content section#block-2 {
		background: url(/site_transino/images/index/block-2-image-01-sp.png) 0 0 no-repeat;
		background-size: 300px;
		height: 193px;
		margin-left: 0;
		margin-top: 20px;
		padding-left: 9px;
		padding-right: 7px;
		padding-top: 320px;
		width: 284px;
	}
	section#content section#block-2 ul li a {
		display: block;
		height: 123px;
		width: 90px;
	}
	section#content section#block-2 ul li.item-1 a {
		background: url(/site_transino/images/index/block-2-button-01-sp.png) 0 0 no-repeat;
		background-size: 90px;
		padding-right: 6px;
	}
	section#content section#block-2 ul li.item-2 a {
		background: url(/site_transino/images/index/block-2-button-02-sp.png) 0 0 no-repeat;
		background-size: 90px;
		padding-right: 6px;
	}
	section#content section#block-2 ul li.item-3 a {
		background: url(/site_transino/images/index/block-2-button-03-sp.png) 0 0 no-repeat;
		background-size: 92px;
		width: 92px;
	}
	section#content section#block-2 ul li a:hover {
		background-position: 0 -123px;
	}
}

/* block-3
--------------------------------------------------------- */
section#content section#block-3 {
	margin-top: 50px;
}
section#content section#block-3 ul li.beginner,
section#content section#block-3 ul li.lab,
section#content section#block-3 ul li.story {
	margin-right: 20px;
}

section#content section#block-3 ul li.lab {
	width: 440px;
}

/* 768px */
@media screen and (max-width: 768px) {
	section#content section#block-3 ul li.beginner,
	section#content section#block-3 ul li.lab,
	section#content section#block-3 ul li.story {
		margin-right: 0;
	}

	section#content section#block-3 ul li.lab {
		width: auto;
	}
}

/* 640px */
@media screen and (max-width: 640px) {
	section#content section#block-3 {
		margin-top: 20px;
	}
}


/* block-4
--------------------------------------------------------- */
section#content section#block-4 {
	background-color: #f6f6f6;
	margin-top: 50px;
	padding: 20px 20px 19px 29px;
}
section#content section#block-4 div.table {
}
section#content section#block-4 div.table div.cell-1 {
	vertical-align: middle;
}
section#content section#block-4 div.table div.cell-1 dl {
}
section#content section#block-4 div.table div.cell-1 dl:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}
section#content section#block-4 div.table div.cell-1 dl dt {
	float: left;
	font-size: 0;
	line-height: 0;
	margin-right: 30px;
}
section#content section#block-4 div.table div.cell-1 dl dd {
	float: left;
}
section#content section#block-4 div.table div.cell-1 dl dd p.text {
	font-size: 0.857em /* = 12px */;
}
section#content section#block-4 div.table div.cell-2 {
	text-align: right;
}

/* 768px */
@media screen and (max-width: 768px) {
	section#content section#block-4 div.table div.cell-1 dl dt {
		float: none;
		margin-right: 0;
	}
	section#content section#block-4 div.table div.cell-1 dl dd {
		float: none;
		margin-top: 10px;
	}
	section#content section#block-4 div.table div.cell-2 {
		text-align: right;
	}
}

/* 640px */
@media screen and (max-width: 640px) {
	section#content section#block-4 {
		margin-top: 20px;
		padding: 15px;
	}
	section#content section#block-4 div.table div.tc {
		display: block;
	}
	section#content section#block-4 div.table div.cell-1 dl dt {
		text-align: center;
	}
	section#content section#block-4 div.table div.cell-1 dl dt img {
		width: 131px;
	}
	section#content section#block-4 div.table div.cell-1 dl dd {
		text-align: center;
	}
	section#content section#block-4 div.table div.cell-2 {
		text-align: center;
	}
	section#content section#block-4 div.table div.cell-2 p.button {
		margin-top: 10px;
	}
	section#content section#block-4 div.table div.cell-2 p.button img {
		width: 270px;
	}
}