@charset "utf-8";

#service_nwr *, #service_nwr *:before,#service_nwr *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}
#service_nwr{padding:0 0 80px 0;}
#service_nwr .pan{max-width:1200px;width:90%;}
#service_nwr ul{padding:0;margin:0;}
.bg_nwr{background:url(../img/service/nwr2/bg.jpg) 0 0 no-repeat;background-size:cover;padding:3em 0 2em 0;}
#service_nwr .br640{display:none;}

/* にっぽんのたびWEB予約について？ */
#service_nwr .description h3{margin-top:4em;}
#service_nwr .description ul{position:relative; overflow:hidden;}
#service_nwr .description ul li{position:relative; overflow:hidden;list-style:none;}
#service_nwr .description .item .left{float:left;width:50%;}
#service_nwr .description .item .right{float:right;width:50%;}
#service_nwr .description .item .thum img{width:100%;}
#service_nwr .description .item .text{position:relative;}
#service_nwr .description .item .text .box{width:90%;position: absolute;top: 50%;left: 50%;transform: translateY(-50%) translateX(-50%);-webkit- transform: translateY(-50%) translateX(-50%);}
#service_nwr .description .item .text h4{font-size:28px;line-height:1.2;border-bottom:1px dashed #e65c00;display:inline-block;padding-bottom:5px;margin-bottom:1em;}
#service_nwr .description .item .text p{line-height:2;font-size:14px;}
#service_nwr .description .bg{background:#f7f7f7;}
#service_nwr .description .item.no1 .text a{display:block;text-align:center;background:#8cd8c3;width:200px;padding:4px;margin:30px auto 0 auto; border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius:5px; -webkit-transition:all .2s ease; -moz-transition:all .2s ease; -ms-transition:all .2s ease; -o-transition:all .2s ease; transition:all .2s ease;}
#service_nwr .description .item.no1 .text a i{padding-left:8px;}
#service_nwr .description .item.no1 .text a:hover{background:#59baa0;}

@media screen and (max-width:991px){
	#service_nwr .description ul {width:90%;margin:0 auto;}
	#service_nwr .description ul li{margin:2em 0;}
	#service_nwr .description ul li.item.no2{margin-top:0;}
	#service_nwr .description .item .thum{float:left;width:35%;}
	#service_nwr .description .item .text{float:left;width:65%;padding:0 1em;}
	#service_nwr .description .item .text .box{padding:0;width:100%;position:relative;top:auto;left:auto;transform: translateY(0) translateX(0);-webkit- transform: translateY(0) translateX(0);}
	#service_nwr .description .item .text h4{font-size:24px;display:block;margin-bottom:0.6em;}
	#service_nwr .description .item .text p{line-height:1.6;margin:1em 0 0 0;}
}
@media screen and (max-width:640px){ 
	#service_nwr .description .item .thum,
	#service_nwr .description .item .text{float:none;width:100%;}
	#service_nwr .description .item .text{padding:0;}
	#service_nwr .description .item .thum{padding-bottom:1em;}
	#service_nwr .description .item.no1 .text a{padding:8px 10px;margin:25px auto 0 auto;}
	#service_nwr .description .item .text h4{font-size:22px;}
}

/* にっぽんのたびWEB予約 */
#service_nwr .section{background:none;}
#service_nwr p{margin:0;line-height:1.4;}
#service_nwr h2{width:95%;margin:0 auto;text-align:center;}
#service_nwr h2 .title_sp{display:none;}
#service_nwr h3{position: relative;display: block;padding:0 0 25px 0;line-height:1.6;text-align:center;width: 340px;margin: 0 auto;}
#service_nwr h3:before,#service_nwr h3:after{content: '';position: absolute;top: 45%;display: inline-block;width: 35px;height: 1px;background:#555;}
#service_nwr h3:before{left:0;-moz-transform: rotate(60deg);-webkit-transform: rotate(60deg);-ms-transform: rotate(60deg);transform: rotate(60deg);}
#service_nwr h3:after{right: 0;-moz-transform: rotate(-60deg);-webkit-transform: rotate(-60deg);-ms-transform: rotate(-60deg);transform: rotate(-60deg);}
#service_nwr h3 .t1{font-size:16px;}
#service_nwr h3 .t2{font-size:28px;}

#service_nwr .cup{font-size:14px;text-align:center;line-height:2;margin:2em auto 0 auto;width:90%;}
#service_nwr .cup span{color:#FD0408;text-decoration:underline;font-weight:bold;}

/* にっぽんのたび　たびびと　ねっぱん */
#service_nwr .plans{width:100%;background:#fff4f6;padding:2em 0;}
#service_nwr .plans .inner{display:table;width:100%;text-align:center;margin:3em auto;max-width:1200px;width:90%;}
#service_nwr .plans .item{display:table-cell;width:47%;border:1px solid #555;background:#fff;padding:2em; border-radius: 10px;-webkit-border-radius: 10px;-moz-border-radius: 10px;box-sizing: border-box;}
#service_nwr .plans .icon{display:table-cell;vertical-align:middle;font-size:30px;color:#777;}
#service_nwr .plans .thum{margin:0 0 2em 0;}
#service_nwr .plans .right .thum{display:table;width:100%;}
#service_nwr .plans .lg_tb,#service_nwr .plans .lg_np{display:table-cell;}
#service_nwr .plans .lg_nw img{max-width:300px;width:100%;}
#service_nwr .plans .lg_np{border-left:2px dotted #aaa;}
#service_nwr .plans .lg_tb img,
#service_nwr .plans .lg_np img{width:87%;}
#service_nwr .plans .line {margin-bottom:15px;}
#service_nwr .plans .line span{color:#481C87;font-weight:bold;font-size:24px;line-height:1.4;background: linear-gradient(transparent 60%, #ffff66 0);}
#service_nwr .plans .text .box {margin:1.5em auto 2em auto;}
#service_nwr .plans .text .box .price{color:#D71618;font-weight:bold;font-size:38px;padding-left:0.5em;}
#service_nwr .plans .note{font-size:12px;}

/* 主な機能のご紹介 */
#service_nwr .newfunc{margin-top:4em;}
#service_nwr .newfunc ul{position:relative; overflow:hidden;padding:0;border-top:1px solid #555;}
#service_nwr .newfunc ul li{position:relative;float:left;width:20%;list-style:none;padding:1em 2em;font-size:14px;border-right:1px solid #555;border-bottom:1px solid #555;}
#service_nwr .newfunc ul li .icon{text-align:center;}
#service_nwr .newfunc ul li img{width:160px;}
#service_nwr .newfunc ul li.last img{width:320px;position: absolute;top: 50%;left: 50%;transform: translateY(-50%) translateX(-50%);-webkit- transform: translateY(-50%) translateX(-50%);}
#service_nwr .newfunc ul li .tt{display:block;text-align:center;margin:10px 0;font-size:16px;font-weight:normal;}
#service_nwr .newfunc ul li .tt span{background: linear-gradient(transparent 40%, #ffff91 0);padding:0 5px;}
#service_nwr .bcl1{background:rgba(200, 219, 78, 0.1);}
#service_nwr .bcl2{background:rgba(196, 67, 68, 0.1);}
#service_nwr .bcl3{background:rgba(77, 174, 176, 0.1);}
#service_nwr .bcl4{background:rgba(226, 147, 43, 0.1);}
#service_nwr .bcl5{background:rgba(86, 177, 146, 0.1);}
#service_nwr .bcl6{background:rgba(93, 109, 178,0.1);}
@media screen and (min-width:1201px){#service_nwr .newfunc ul li:nth-child(5n){border-right:none;}}
@media screen and (max-width:1200px){
	#service_nwr .newfunc ul li{width:25%;}
	#service_nwr .newfunc ul li:nth-child(4n){border-right:none;}
}
@media screen and (max-width:991px){
	#service_nwr .newfunc ul li{width:33.33%;}
	#service_nwr .newfunc ul li:nth-child(4n){border-right:1px solid #555;}
	#service_nwr .newfunc ul li:nth-child(3n){border-right:none;}
}
@media screen and (max-width:640px){
	#service_nwr .newfunc ul li{width:50%;}
	#service_nwr .newfunc ul li:nth-child(3n){border-right:1px solid #555;}
	#service_nwr .newfunc ul li:nth-child(2n){border-right:none;}
}
@media screen and (max-width:480px){
	#service_nwr .newfunc ul li{float:none;width:100%;border-right:none;padding:1em;}
	#service_nwr .newfunc ul li:nth-child(3n){border-right:none;}
	#service_nwr .newfunc ul li.last img{position: relative;top: auto;left: auto;transform: translateY(0) translateX(0);-webkit- transform: translateY(0) translateX(0);}
}

#service_nwr .newprice{width:100%;background:#f7f7f7;padding:4em 0;}
#service_nwr .newprice .inner{max-width:1200px;width:90%;margin:0 auto;}
#service_nwr table{position: relative; width: 100%; font-size:14px;}
#service_nwr table th,#service_nwr table td{ padding:8px 10px; font-weight:normal; line-height:1.6;vertical-align: middle;text-align:left;}
#service_nwr table th{ border-right: 1px dotted #f2e6ae;}
#service_nwr table tr{ border-bottom: 1px dotted #f2e6ae;}
#service_nwr table tr:last-child{ border-bottom:none;}
#service_nwr table tr:nth-child(odd){ background:#FEFEFB;}
#service_nwr table tr:nth-child(even){ background:#FCF9EA;}
#service_nwr .tb_item2 th{background:#abd8f2;}
#service_nwr .tb_item2 td{border-right:1px dotted #f2e6ae;}
#service_nwr .tb_item2 th:last-child,#service_nwr .tb_item2 td:last-child{ border-right:none;}
#service_nwr table th.th1{width:210px;}
#service_nwr table th.th2{width:110px;}
#service_nwr table th.th3{width:115px;}
#service_nwr table th.th4{width:200px;}
#service_nwr table th.th5{width:400px;}
/* カレンダースクロール */
#service_nwr .tableScroll{overflow: auto;/*white-space: nowrap;*/-webkit-overflow-scrolling: touch;}
#service_nwr .tableScroll::-webkit-scrollbar{/*tableにスクロールバーを追加*/ height:5px;}
#service_nwr .tableScroll::-webkit-scrollbar-track{/*tableにスクロールバーを追加*/ background: #F1F1F1;}
#service_nwr .tableScroll::-webkit-scrollbar-thumb {/*tableにスクロールバーを追加*/ background: #BCBCBC;}

@media screen and (max-width:991px){ 

	#service_nwr .tb_item2{width:1000px;}
	#service_nwr .tableScroll:before{ content: "左右にスクロールできます"; font-size:12px; background-color:#ffe882; border-radius:3px; padding:0.5em;margin-bottom:3px;display:inline-block;}

	#service_nwr table th .mark{background: linear-gradient(transparent 60%, #ffff66 0);}
	#service_nwr .tb_item1 th,#service_nwr .tb_item1 td{display:block; width:100%;}
	#service_nwr .tb_item1 th{font-size:16px;padding-bottom:0;border-right:none;}
}

@media screen and (max-width:768px){ 
	.bg_nwr{background:url(../img/service/nwr2/bg_sp.jpg) 0 0 no-repeat;}
	#service_nwr .pan{display:none;}
	#service_nwr h2 .title_pc{display:none;}
	#service_nwr h2 .title_sp{display:block;text-align:center;}
}

@media screen and (max-width:640px){
	#service_nwr .br640{display:block;}
	
	/* にっぽんのたび　たびびと　ねっぱん */
	#service_nwr .plans{padding:1em 0;}
	#service_nwr .plans .item{display:block;width:100%;padding:1.5em 1em;}
	#service_nwr .plans .icon{display:block;padding:10px 0;}
	#service_nwr .plans .lg_nw img{max-width:240px;}
	#service_nwr .plans .lg_tb img,#service_nwr .plans .lg_np img{max-width:200px;}
}
@media screen and (max-width:480px){
	#service_nwr h3{width: 290px;}
	#service_nwr h3:before,#service_nwr h3:after{width: 35px;}
	#service_nwr h3 .t2{font-size:24px;}
	#service_nwr .plans .text .box .price{font-size:34px;}
}