@charset "UTF-8";
/* CSS Document */

/*----------------------------------
	index用のCSSです
----------------------------------*/

/*start_リニューアル2021対応*/
:where(.containner) *,
:where(.containner)::after,
:where(.containner)::before {
  box-sizing: content-box;
}

:where(.containner) img {
  width: auto;
}
/*end_リニューアル2021対応*/

.contents{
    width: 960px;
    margin: 0 auto;
}
.contents * { box-sizing:border-box;}
.contents img { vertical-align:top; width: 100%;}
.contents .otherBtn img {width: auto;}
h2 { margin-bottom:20px;}

.box_new { float:left; width:730px; height:auto; margin-bottom:20px;}
.box_new .inbox {
	padding:15px 0 0 15px;
	background-color:#f0f5ff;
	border:solid 4px #023ca2;
	border-top:none;
}
.box_new .inbox ul { float:left; width:340px; height:auto; margin:0 11px 24px 0;}
.box_new .inbox ul li { float:left; vertical-align:top;}
.box_new .inbox ul .icn { width:51px; height:auto;}
.box_new .inbox ul .txt {
	width:289px;
	background-color:#fff;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	position:relative;
	height:75px;
}
.box_new div.inbox > ul li.txt::before {
    background: rgba(0, 0, 0, 0) url("/attending/fuk-i/198104/images/arrow01.png") no-repeat scroll 0 0;
     content: " ";
    height: 11px;
    left: -7px;
    position: absolute;
    top: 45px;
    width: 12px;
}
.box_new .inbox ul .txt span {
	display: inline-block;
    font-size: 12px;
    height: 60px;
    line-height: 1.8;
    overflow: hidden;
    padding: 17px 15px;
}


.box_new .inbox ul li.txt span.comment { position: relative; }
.box_new .inbox ul li.txt span.comment:before, .comment:after { position: absolute; background: #fff;}
.box_new .inbox ul li.txt span.comment:before { content: "･･･"; bottom: 1px; right:14px;}
.box_new .inbox ul li.txt span.comment:after { content: ""; width: 100%; height: 100%; }


.box_topic { float: right;
    height: 255px;
    margin-bottom: 20px;
    overflow: hidden;
    width: 220px;}
.box_topic dl dd { font-size:12px; line-height:1.2; color:#1d3994; padding-top:5px;}

.box_other { float:left; width:960px; height:auto; margin-bottom:20px;}
.box_other .inbox {
	padding:10px 0 10px 10px;
	background-color:#f0f5ff;
	border:solid 4px #023ca2;
	border-top:none;
}
.box_other .inbox dl {
	float:left;
	width:225px;
	height:auto;
	margin-right:10px;
	margin-bottom:10px;
}
.box_other .inbox dl dd {
	color: #1d3994;
    font-size: 12px;
    height: 50px;
    line-height: 1.2;
    overflow: hidden;
    padding-top: 5px;
}

.tab { clear:both;}
.tab li { float: left; margin: 0 30px 0 0; cursor: pointer;}
.tab li:nth-child(3) { margin-right:14px;}
.tab li:last-of-type { margin-right:0;}
.area { clear:both; margin-top:-5px;}
.area section { display: none; overflow:hidden; margin-bottom:20px; padding:20px 15px;}
.area section.show { display: block;}

/* オーストラリア */
.area section.area01 { background:#f2f9ff url(/attending/fuk-i/198104/images/tab01_bdr.png) no-repeat top center; border:solid 5px #217ad5; border-top:none;}
.area section.area01 div .tab01bdr { border:solid 1px #217ad5; background:#fff;}
.area section.area01 .tourInBox01 .dateMds { background:url(/attending/fuk-i/198104/images/tab01SbTtl01.png) no-repeat;  height:30px; font-size:18px; line-height:1.2; color:#fff; padding:5px 0 0 40px; white-space:nowrap;}

/* ニュージー */
.area section.area02 { background:#fbeff4 url(/attending/fuk-i/198104/images/tab02_bdr.png) no-repeat top center; border:solid 5px #e55c91; border-top:none;}
.area section.area02 div .tab01bdr , .area section.area02 div .tab02bdr { border:solid 1px #e55c91; background:#fff;}
.area section.area02 .tourInBox01 .dateMds { background:url(/attending/fuk-i/198104/images/tab02SbTtl01.png) no-repeat;  height:30px; font-size:18px; line-height:1.2; color:#fff; padding:5px 0 0 40px; overflow:hidden;}

/* 南の島々 */
.area section.area03 { background:#fcf4ef url(/attending/fuk-i/198104/images/tab03_bdr.png) no-repeat top center; border:solid 5px #eb6100; border-top:none;}
.area section.area03 div .tab01bdr ,.area section.area03 div .tab02bdr { border:solid 1px #eb6100; background:#fff;}
.area section.area03 .tourInBox01 .dateMds { background:url(/attending/fuk-i/198104/images/tab03SbTtl01.png) no-repeat;  height:30px; font-size:18px; line-height:1.3; color:#fff; padding:5px 0 0 40px; overflow:hidden;}

/* 共通 */
.area section .tourBox { float:left; overflow:hidden; width:680px; height:auto; margin-bottom:10px;}

.area section.area01 .tourInBox01,.area section.area02 .tourInBox01,.area section.area03 .tourInBox01{background: #eee;
  overflow: hidden;
  width: 100%;}
.area section.area01 .tourInBox01 .dateMds,.area section.area02 .tourInBox01 .dateMds,.area section.area03 .tourInBox01 .dateMds { overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;}

.area section .tourInBox01 { float:left; background-color:#fff; margin-bottom:23px; height:480px; }
.area section .tourInBox01 dl  {  height:auto; padding:10px; height:449px; background: #eee; overflow: hidden; width: 100%;}
.area section .tourInBox01 dl .pict ul { overflow:hidden;}
.area section .tourInBox01 dl .pict ul .p01 { float:left; width:440px; height:328px;}
.area section .tourInBox01 dl .pict ul .p02 { float:right; width:215px; height:162px; margin-bottom:4px;}
.area section .tourInBox01 dl .pict ul .p03 { float:right; width:215px; height:162px;}
.area section .tourInBox01 dl dt {  height: 30px; overflow: hidden;  width: 660px; text-overflow: ellipsis; white-space: nowrap;}
.area section .tourInBox01 dl {}
.area section .tourInBox01 dl dt a { font-size:18px; line-height:1.5; color:#1d2974;}
.area section .tourInBox01 dl .price { font-size:18px; line-height:1.5; color:#de1715; text-align:right;}
.area section .tourInBox01 dl .detail ul { overflow:hidden;}
.area section .tourInBox01 dl .detail ul .txt { loat:left; width:480px; font-size:14px;}

.area section .tourInBox01 dl .detail ul .ellipsis { position: relative; height: 34px; overflow: hidden; line-height: 18px; margin-bottom:5px;}
.area section .tourInBox01 dl .detail ul .ellipsis:before, .ellipsis:after { position: absolute; background: #fff;}
.area section .tourInBox01 dl .detail ul .ellipsis:before { content: "･･･"; bottom: 0; right: 0;}
.area section .tourInBox01 dl .detail ul .ellipsis:after { content: ""; width: 100%; height: 100%;}
.area section .tourInBox01 dl .detail ul .btn { float:right; width:170px; height:30px;}

.area section .tourInBox02{ width:332px; height:480px; float:left; margin-bottom:23px;}
/*.area section .tourInBox02:nth-child(2n){margin-right: 0px !important;}*/
.area section .tourInBox02 dl { width:332px; height:480px; padding:10px; }
.mr:nth-child(odd) { float:left !important; margin-right: 0px; !important;}
.mr:nth-child(even) { float:left !important; margin-right: 15px; !important;}
.area section .tourInBox02 dl .pict { width:310px; height:233px;}
.area section .tourInBox02 dl dt a { font-size:14px; line-height:1.8; color:#1d2974;}
.area section .tourInBox02 dl .price { font-size:16px; line-height:1.6; color:#de1715; text-align:right;}
.area section .tourInBox02 dl .txt { width:303px; font-size:14px;}

.area section .tourInBox02 dl .ellipsis { position: relative; height: 93px; overflow: hidden; line-height: 23px; margin-bottom:10px;}
.area section .tourInBox02 dl .ellipsis:before, .ellipsis:after { position: absolute; background: #fff;}
.area section .tourInBox02 dl .ellipsis:before { content: "･･･"; bottom: 0; right: 0;}
.area section .tourInBox02 dl .ellipsis:after { content: ""; width: 100%; height: 100%;}
.area section .tourInBox02 dl  .btn { width:305px; height:38px; text-align:center;}

.tab01bdr dt{ height:54px; overflow:hidden; margin-top:5px; }
	

.area section .tourInBox02 dl dt.tour02ttl { position: relative; }
.area section .tourInBox02 dl dt.tour02ttl:before, .tour02ttl:after { position: absolute; background: #fff;}
.area section .tourInBox02 dl dt.tour02ttl:before { content: "･･･"; bottom: 6px; right: 0;}
.area section .tourInBox02 dl dt.tour02ttl:after { content: ""; width: 100%; height: 100%; }

  
 .area section .tourInBox03 { float:right; background-color:#fff;}
.area section .tourInBox03 dl { width:332px; height:auto; padding:10px;}
.area section .tourInBox03 dl .pict { width:310px; height:233px;}
.area section .tourInBox03 dl dt a { font-size:14px; line-height:1.5; color:#1d2974;}
.area section .tourInBox03 dl .price { font-size:14px; line-height:1.5; color:#de1715; text-align:right;}
.area section .tourInBox03 dl .txt { width:305px; font-size:14px;}

.area section .tourInBox03 dl .ellipsis {position: relative; height: 75px; overflow: hidden; line-height: 25px;}
.area section .tourInBox03 dl .ellipsis:before, .ellipsis:after { position: absolute; background: #fff;}
.area section .tourInBox03 dl .ellipsis:before { content: "･･･"; bottom: 0; right: 0;}
.area section .tourInBox03 dl .ellipsis:after { content: ""; width: 100%; height: 100%;}
.area section .tourInBox03 dl  .btn { width:305px; height:38px; text-align:center;}

.area section .tourInBox04 { clear:both; padding-top:10px;}
.area section .tourInBox04 ul { overflow:hidden; border-bottom:dotted 1px #adb2b3; margin-bottom:10px; padding-bottom:10px;}
.area section .tourInBox04 ul .name { float:left; width:500px; height:auto; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.area section .tourInBox04 ul .name a { font-size:14px; line-height:1.5; color:#232584;}
.area section .tourInBox04 ul .price { float:right; font-size:14px; line-height:1.5; color:#de1715; text-align:right;}

.blogBox { float:right; width:220px; height:auto; margin-bottom:10px;}
.blogInBox { padding:10px 20px; background-color:#fff;}
.blogInBox dl { border-bottom:solid 2px #abaaaa; margin-bottom:8px; padding-bottom:5px;}
.blogInBox dl .date { font-size:12px; line-height:1.5;}
.blogInBox dl .pht01 { width:180px; height:135px;}
.blogInBox dl .pht01 img{ width:180px; height:135px;}
.blogInBox dl .pht02 { width:180px; height:120px;}
.blogInBox dl .txt { font-size:12px; line-height:1.5; color:#1d2382;}
.blogInBox .btn{ width:180px; height:34px; margin:0 auto;}
div.tab01bdr dt.txt{ height:30px; margin-top:3px; line-height:1.2;}

.guideBox01,
.guideBox02 { clear:both;}
.guideBox01 h4,
.guideBox02 h4 { margin-bottom:10px;}
.guideBox01 ul,
.guideBox02 ul { overflow:hidden;}
.guideBox01 ul li,
.guideBox02 ul li { float:left; margin:0 10px 10px 0;}

.otherBtn { width:900px; height:auto; text-align:right; margin-bottom:20px;} 

.keywordBox { clear:both;}
.keywordInBox { background-color:#fff; padding:10px 15px 0;}
.keywordBox { clear:both; margin-bottom:20px;}
/*.keywordBox h4 { margin-bottom:10px;}*/
.keywordBox ul { overflow:hidden;}
.keywordBox ul li { float:left; margin:0 10px 10px 0;}
.keywordBox ul li a { font-size:14px; line-height:1.5;}
.keywordBox ul li a:before {
	content:"▶";
	color:#f9b700;	
}
/*.keywordBox ul li span { font-size:14px; line-height:1.5; color:#f9b700;}*/

.btmContents { clear:both; overflow:hidden; margin-bottom:20px;}
.btmContents dl { float:left; width:233px; height:auto; margin-right:9px;}
.btmContents dl:nth-child(3) { margin-right:10px;}
.btmContents dl:last-of-type {margin-right:0;}
.btmContents dl dd { border:solid 1px #023ca2; padding:10px;}
.btmContents dl dd ul .txt { font-size:12px; line-height:1.5; margin-bottom:5px;}
.odd_box{ margin-right: 16px; }
