@charset "UTF-8";
/*配下ページCSS*/

/*
.breadcrumb{
	max-width:970px;
	margin:0 auto;
}
.breadcrumb p{
	font-size:0.8em;
	line-height:1.2rem;
	padding-top:5px;
}
*/

/*キービジュ*/
.container #key{
	margin-top:20px;
}
.container .keyContainer{
	max-height:650px;
	overflow:hidden;
	position: relative;
}
.container .keyItem img{
	width:100%;
}
.container .keyGrid{
	display: -ms-grid;
	display: grid;
	gap:0;
	-ms-grid-columns: 4.5fr 0 8.2fr;
	grid-template-columns: 4.5fr 8.2fr;
}
.container .keyItem:nth-child(1){
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}
.container .keyItem:nth-child(2){
    -ms-grid-row: 1;
    -ms-grid-column: 3;
}

.container .keyTitleEn{
	font-size:35pt;
	line-height:2.8rem;
}
.container .keyTitleJa{
	font-size:18pt;
	color:#ffffff;
	padding-top:25px;
	padding-bottom:10px;
	line-height:1.8rem;
}
.container .keyDesc{
	color:#ffffff;
	line-height:1.5rem;
}

.container .keyLogo{
	position:absolute;
	bottom:30px;
	left:12%;
	display: none;
}
.container .keyLogo .usaLogo{
	width:120px;
}


/*ヨセミテ*/

.container .yosemite .keyLeft{
	padding:10% 5% 0 35%;
}

.container .yosemite .keyLeft{
	background:url(../images/sub/yosemite/key-bg.jpg) left top no-repeat;
	background-size: cover;
}

.container .yosemite .keyTitleEn{
	color:#4c8c62;
}

/*イエローストーン*/

.container .yellowstone .keyLeft{
	padding:10% 5% 0 35%;
}

.container .yellowstone .keyLeft{
	background:url(../images/sub/yellowstone/key-bg.jpg) left top no-repeat;
	background-size: cover;
}

.container .yellowstone .keyTitleEn{
	color:#eaa663;
}

/*グランドキャニオン*/

.container .grandcanyon .keyLeft{
	padding:10% 5% 0 35%;
}

.container .grandcanyon .keyLeft{
	background:url(../images/sub/grandcanyon/key-bg.jpg) left top no-repeat;
	background-size: cover;
}

.container .grandcanyon .keyTitleEn{
	color:#cd8c82;
}

/*ブライスキャニオン*/

.container .brycecanyon .keyLeft{
	padding:10% 5% 0 35%;
}

.container .brycecanyon .keyLeft{
	background:url(../images/sub/brycecanyon/key-bg.jpg) left top no-repeat;
	background-size: cover;
}

.container .brycecanyon .keyTitleEn{
	color:#b18eb9;
}

/*グランドティ-トン*/

.container .grandteton .keyLeft{
	padding:10% 5% 0 35%;
}

.container .grandteton .keyLeft{
	background:url(../images/sub/grandteton/key-bg.jpg) left top no-repeat;
	background-size: cover;
}

.container .grandteton .keyTitleEn{
	color:#8174a4;
}

/*自由の女神*/

.container .eastcoast .keyLeft{
	padding:10% 5% 0 35%;
}

.container .eastcoast .keyLeft{
	background:url(../images/sub/thestatueofliberty/key-bg.jpg) left top no-repeat;
	background-size: cover;
}

.container .eastcoast .keyTitleEn{
	color:#e58475;
}


/*見どころ*/
.container #spot{
	margin-top:60px;
}
.container .spotGrid{
	margin: 0 auto;
	display: -ms-grid;
	display: grid;
	gap:32px;
	-ms-grid-columns: 1fr 32px 1fr 32px 1fr;
	grid-template-columns: repeat(3, 1fr);
}
.container .spotItem img{
	width: 100%;
}
.container .spotItem:nth-child(1){
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}
.container .spotItem:nth-child(2){
    -ms-grid-row: 1;
    -ms-grid-column: 3;
}
.container .spotItem:nth-child(3){
    -ms-grid-row: 1;
    -ms-grid-column: 5;
}

.container .spotName{
	text-align: center;
	font-size:13pt;
	letter-spacing:-0.05em;
	padding-top:15px;
	padding-bottom:5px;
}
.container .spotDesc{
	line-height:1.5rem;
}

.container .spotImg{
	position: relative;
}
.container .picCopyright02{
	position: absolute;
	font-size:.8em;
	color:#ffffff;
	line-height:1.5rem;
	bottom:0px;
	right: 8px;
}
.container .picCopyright02 span{
	font-size:1.3em;
	vertical-align: -1px;
}

.container .pointImg{
	position: relative;
}

.container .picCopyright{
	font-size:.8em;
	line-height:1.5rem;
	text-align: right;
}
.container .picCopyright span{
	font-size:1.3em;
	vertical-align: -1px;
}



/*コース*/
.container #course{
	margin:60px auto 15px;
}
.container .courseTitle{
	text-align:center;
	margin-bottom: 30px;
}

/*コース(3つ)*/
.container .courseGrid{
	margin: 0 auto;
	display: -ms-grid;
	display: grid;
	gap:32px;
	-ms-grid-columns: 1fr 32px 1fr 32px 1fr;
	grid-template-columns: repeat(3, 1fr);
}
.container .courseItem:nth-child(1){
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}
.container .courseItem:nth-child(2){
    -ms-grid-row: 1;
    -ms-grid-column: 3;
}
.container .courseItem:nth-child(3){
    -ms-grid-row: 1;
    -ms-grid-column: 5;
}

/*コース(2つ)*/
.container .courseGrid02{
	max-width:650px;	
	margin: 0 auto;
	display: -ms-grid;
	display: grid;
	gap:32px;
	-ms-grid-columns: 1fr 32px 1fr;
	grid-template-columns: repeat(2, 1fr);
}
.container .courseItem02:nth-child(1){
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}
.container .courseItem02:nth-child(2){
    -ms-grid-row: 1;
    -ms-grid-column: 3;
}

.container .courseItem img,.container .courseItem02 img{
	width: 100%;
}
.container .courseName{
	font-size:12pt;
}

/*注目ポイント*/
.container #point{
	margin-top:60px;
}
.container #point img{
	width:100%;
}
.container .pointGrid{
	margin: 0 auto;
	display: -ms-grid;
	display: grid;
	gap:26px;
	-ms-grid-columns:7fr 26px 2fr;
	grid-template-columns:7fr 2fr;
}
.container .pointItem:first-child{
	background:#fdf6df;
	padding:25px 20px;
  outline: 1px #c69c6d solid;
  outline-offset: -4px;
}
.container .pointItem:last-child{
	border:1px #b3b3b3 solid;
	padding:20px;
}
.container .pointItem:nth-child(1){
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}
.container .pointItem:nth-child(2){
    -ms-grid-row: 1;
    -ms-grid-column: 3;
}

.container .pointGridSub01{
	display: -ms-grid;
	display: grid;
	gap:15px;
	-ms-grid-columns:47fr 15px 16fr;
	grid-template-columns:47fr 16fr;
}
.container .pointGridSub01s{
	display: -ms-grid;
	display: grid;
	gap:15px;
	-ms-grid-columns:47fr 15px 28fr;
	grid-template-columns:47fr 28fr;
}
.container .pointItemSub01:nth-child(1),.container .pointItemSub01s:nth-child(1){
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}
.container .pointItemSub01:nth-child(2),.container .pointItemSub01s:nth-child(2){
    -ms-grid-row: 1;
    -ms-grid-column: 3;
}

/*ポイントセクション縦長写真用*/
.container .pointGridSub01t{
	display: -ms-grid;
	display: grid;
	gap:15px;
	-ms-grid-columns:47fr 15px 13fr;
	grid-template-columns:47fr 13fr;
}
.container .pointItemSub01t:nth-child(1){
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}
.container .pointItemSub01t:nth-child(2){
    -ms-grid-row: 1;
    -ms-grid-column: 3;
}

.container .pointGridSub02{
	display: -ms-grid;
	display: grid;
	gap:15px;
	-ms-grid-columns:12fr 15px 35fr;
	grid-template-columns:12fr 35fr;
}
.container .pointItemSub02:nth-child(1){
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}
.container .pointItemSub02:nth-child(2){
    -ms-grid-row: 1;
    -ms-grid-column: 3;
}

.container .withoutPic{
	padding-left:5px;
}

.container .pointTitle{
	font-size:13pt;
	padding-bottom:15px;
}
.container .pointDesc{
	padding-bottom: 10px;
}

/*一覧に戻る*/

.container #backtolist{
	margin-top:60px;
}

.container .backtolistContainer {
	margin:0 auto;
	position: relative;
	width: 100%;
	cursor: pointer
}

.container .backtolistTitle {
	display: block;
	position: relative;
	margin: 0 auto;
	padding: 0.625em 0.625em 0.625em 2em;
	font-size: 1.25em;
	font-weight: normal;
	color: #fff;
	background: #999999;
	border-radius:4px;
	cursor: pointer;
	max-width:460px;
	transition: 1.0s;
}

.container .backtolistTitle:hover,
.container .backtolistTitle:active{
	background-color:#666666;
	color: white;
}

.container .backtolistTitle:hover i:before,
.container .backtolistTitle:hover i:active{
	color: white;
}

.container .backtolistTitle{
	position: relative;
	text-align: center;
}

.container .backtolistTitle:after {
	font-family: 'Font Awesome 5 Free';
	content: '\f054';
	font-weight: bold;
	position: absolute;
	right: 25px;
	top: 28%;
	display: block;
}

.container a.backtolist{
	text-decoration:none!important;
}



/*レスポンシブ対応*/
@media screen and (min-width: 1601px){
.container .keyItem img{
	position: relative;
	top:-5%;
}
}
@media screen and (min-width: 1201px){
.container .grandteton .keyTitleEn{
	font-size:32pt;
	line-height: 2.4rem;
}
}

@media screen and (max-width: 1200px){
.container .keyTitleEn{
	font-size:28pt;
	line-height: 2rem;
}
.container .keyLogo{
	left:3%;
}

/*ヨセミテ*/
.container .yosemite .keyLeft{
	padding:15% 5% 0 10%;
}
/*イエローストーン*/
.container .yellowstone .keyLeft{
	padding:10% 5% 0 10%;
}
/*グランドキャニオン*/
.container .grandcanyon .keyLeft{
	padding:10% 5% 0 10%;
}

/*ブライスキャニオン*/
.container .brycecanyon .keyLeft{
	padding:10% 5% 0 10%;
}

/*グランドティトン*/
.container .grandteton .keyLeft{
	padding:10% 5% 0 10%;
}

/*東海岸*/
.container .eastcoast .keyLeft{
	padding:10% 5% 0 10%;
}
}

@media screen and (max-width: 1024px){
.container .keyTitleEn{
	font-size:24pt;
	line-height: 1.8rem;
}
.container .keyLogo{
		left:1.5%;
}
/*ヨセミテ*/
.container .yosemite .keyLeft{
	padding:15% 5% 0 5%;
}
/*イエローストーン*/
.container .yellowstone .keyLeft{
	padding:5% 5% 0 5%;
}
/*グランドキャニオン*/
.container .grandcanyon .keyLeft{
	padding:5% 5% 0 5%;
}

/*ブライスキャニオン*/
.container .brycecanyon .keyLeft{
	padding:5% 5% 0 5%;
}

/*グランドティトン*/
.container .grandteton .keyLeft{
	padding:5% 5% 0 5%;
}

/*東海岸*/
.container .eastcoast .keyLeft{
	padding:5% 5% 0 5%;
}


}

@media screen and (min-width: 970px){
.container .displaypcx2{
			display:block;
}
}

@media screen and (min-width: 768px) and (max-width: 969px){
.container .keyLogo{
	bottom:15px;
}
.container .keyLogo .usaLogo{
	width:100px;
}
}

@media screen and (max-width: 969px){
.container .breadcrumb{
	padding-left:5%;
	padding-right:5%;
}
.container .displaypcx2{
	display:none;
}
.container .spotContainer,.container .courseContainer,.container .pointContainer{
	padding-left:5%;
	padding-right:5%;
	margin:0 auto;
}
.container .keyTitleJa{
	font-size:13pt;
}
.container .keyDesc{
	font-size:9pt;
	line-height:1.2rem;
}

/*ヨセミテ*/
.container .yosemite .keyLeft{
	padding:10% 5% 0 5%;
}
/*イエローストーン*/
.container .yellowstone .keyLeft{
	padding:10% 5% 0 5%;
}
/*グランドキャニオン*/
.container .grandcanyon .keyLeft{
	padding:10% 5% 0 5%;
}
/*ブライスキャニオン*/
.container .brycecanyon .keyLeft{
	padding:10% 5% 0 5%;
}

/*グランドティトン*/
.container .grandteton .keyLeft{
	padding:10% 5% 0 5%;
}

/*東海岸*/
.container .eastcoast .keyLeft{
	padding:10% 5% 0 5%;
}
.container .pointGridSub01t{
	-ms-grid-columns:47fr 15px 18fr;
	grid-template-columns:47fr 18fr;
}

}

@media screen and (min-width: 768px){
/*common*/
.container .displaypc{
	display: block;
}
.container .displaysp{
	display: none;
}
}
@media screen and (max-width: 767px){
/*common*/
.container .displaypc{
	display: none;
}
.container .displaysp{
	display: block;
}
.container .spotGrid,.container .courseGrid,.container .courseGrid02,.container .pointGrid,.container .pointGridSub01,.container .pointGridSub01s,.container .keyGrid{
	-ms-grid-columns:1fr;
	grid-template-columns:1fr;
}

.container .keyContainer{
	max-height:none;
}

.container .keyItem:first-child{
	order:2;
}
.container .keyItem:last-child{
	order:1;
}

.container .keyGrid{
	-ms-grid-rows:1fr 0 0.7fr;
}
.container .keyItem:nth-child(1){
    -ms-grid-row: 3;
    -ms-grid-column: 1;
}
.container .keyItem:nth-child(2){
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}
.container .keyLogo{
	left:5%;
	bottom:15px;
}


.container .spotGrid{
	-ms-grid-rows:1fr 30px 1fr 30px 1fr;
}
.container .spotItem:nth-child(2){
    -ms-grid-row: 3;
    -ms-grid-column: 1;
}
.container .spotItem:nth-child(3){
    -ms-grid-row: 5;
    -ms-grid-column: 1;
}

.container .courseGrid{
	-ms-grid-rows:1fr 20px 1fr 20px 1fr;
}
.container .courseItem:nth-child(2){
    -ms-grid-row: 3;
    -ms-grid-column: 1;
}
.container .courseItem:nth-child(3){
    -ms-grid-row: 5;
    -ms-grid-column: 1;
}
.container .courseGrid02{
	-ms-grid-rows:1fr 20px 1fr;
}
.container .courseItem02:nth-child(2){
    -ms-grid-row: 3;
    -ms-grid-column: 1;
}
.container .pointGrid{
	-ms-grid-rows:1fr 30px auto;
}
.container .pointItem:nth-child(2){
    -ms-grid-row: 3;
    -ms-grid-column: 1;
}

.container .pointGridSub01,.container .pointGridSub01s{
	-ms-grid-rows:auto 20px 1fr;
}
.container .pointItemSub01:nth-child(2),.container .pointItemSub01s:nth-child(2){
    -ms-grid-row: 3;
    -ms-grid-column: 1;
}

.container .pointGridSub02{
	-ms-grid-columns:1fr 15px 3fr;
	grid-template-columns:1fr 3fr;
}
.container .pointItemSub02:nth-child(1){
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}
.container .pointItemSub02:nth-child(2){
    -ms-grid-row: 1;
    -ms-grid-column: 3;
}

.container .keyTitleEn{
	font-size:35pt;
	line-height: 3rem;
}
.container .keyTitleJa{
	font-size:16pt;
}
.container .keyDesc{
	font-size:12pt;
	line-height:1.5rem;
}

.container .access{
	margin:0 auto;
	width:80%;
}

.container .grandcanyon .keyLeft,.container .yosemite .keyLeft,.container .brycecanyon .keyLeft,.container .yellowstone .keyLeft,.container .grandteton .keyLeft,.container .eastcoast .keyLeft{
	padding:5% 5% 20%;
}

.container .backtolistContainer{
	width: auto;
}

/*selection*/
.container .decoTitle{
	width:100%;
}

}

@media screen and (max-width: 600px){
.container .backtolistContainer{
	padding-left:5%;
	padding-right:5%;
}

/*ポイントセクション縦長写真用*/
.container .pointGridSub01t{
	-ms-grid-columns:1fr 15px 1fr;
	grid-template-columns:1fr;

}
.container .pointItemSub01t:nth-child(2){
    -ms-grid-row: 3;
    -ms-grid-column: 1;
}
}

@media screen and (min-width: 468px){
/*common*/
.container .displaypcx{
	display: block;
}
.container .displayspx{
	display: none;
}
}
@media screen and (max-width: 467px){
/*common*/
.container .displaypcx{
	display: none;
}
.container .displayspx{
	display: block;
}
.container .decoTitle{
	font-size:1.3em;
}

.container .keyTitleEn{
	font-size:25pt;
	line-height: 2rem;
}
.container .keyDesc{
	font-size:10pt;
}
.container .access{
	width:90%;
}

.container .pointGridSub02{
	-ms-grid-columns:1fr 15px 1fr;
	grid-template-columns:1fr 1fr;
	-ms-grid-rows:auto 15px auto;
}
.container .pointTtemSub02:nth-child(1){
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}
.container .pointTtemSub02:nth-child(2){
    -ms-grid-row: 1;
    -ms-grid-column: 3;
}

.container .pointTitleFirst{
	padding-top:20px;
	padding-left:5px;
}

.container .withoutPic .pointTitleFirst{
	padding-top:0;
	padding-left:0;
}
.container .withoutPic .pointTitle{
	padding-bottom:0;
}

.container .courseTitle{
	font-size:1.3em;
}

.container .grandcanyon .keyLeft,.container .yosemite .keyLeft,.container .brycecanyon .keyLeft,.container .yellowstone .keyLeft,.container .grandteton .keyLeft,.container .eastcoast .keyLeft{
	padding:5% 5% 30%;
}

.container .backtolistTitle {
	font-size: 1em;
}

}
