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

body {
	font-family: '游ゴシック体', 'Yu Gothic', YuGothic, sans-serif;
    font-weight: 500;
	color: #555;
	font-size: 17px;
	text-align: left;
	-webkit-text-size-adjust: 100%;		/* 文字サイズの自動調整機能のキャンセル */
	background-color:#fae5be;
}

.win body {
	font-family: 'メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}


img {
	max-width: 100%;
	height: auto;
}

.ie8 img {
	width: auto;
}

#wrapper {
	width: auto;
	min-height: 100%;
	height: auto !important;
	position: relative;
}

#wrapper_inner {
	position:absolute;
	max-width: 1200px;
	left: 50%;
	margin-left: -600px;
	/*max-width: 1200px;*/
    height: auto;
	background-color: #FEF3E4;
	overflow: hidden;
}


div#content {
	width: 1200px;
}

.row {
	max-width:1000px;
	margin: 0 auto 0;
}

#header {
	width:100%;
	height:auto;
	}

#rogo {
	width: 100%;
	max-width: 1000px;
	margin: 20px auto 10px;
	text-align:center;
	}
	
.rogo { width: 47%;}
.rogo_x { width: 6%;}
	
#flags_Japan img, #flags_india img {
	box-shadow: 2px 2px 2px #999999;
	}
	
#flags img { width: 47%; margin-right:3%}

/* ---------スライドショー---------　*/

	.bxslider {
	width: auto;
	}
	
	.bxslider li {
	background-color:#FFF;
	}
	
	.bxslider p {
	margin: 7px auto 0px ;
	width: 90%;
	font-size:90%;
	text-align:center;
	}
	
	.bx-controls {
	background-color:#FFF;
	padding-bottom: 1.5%;}
	
	.bx-wrapper .bx-pager {
	bottom: -95px;
	}
	
	.bx-wrapper .bx-pager a {
	border: solid #ccc 1px;
	display: block;
	margin: 3px;
	padding:0;
	}
  
	.bx-wrapper .bx-pager a:hover,
	.bx-wrapper .bx-pager a.active {
	border: solid #5280DD 1px;
	}
	
	.bx-wrapper {
	background-color:#FFF;
	}

/* ---------スライドショーここまで---------　*/

	.lead_sentence {
	margin: 4% 0;
	font-size: 140%;
	font-family: century,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
	text-align:center;
	}
	
	.lirio_title {
	width: 100%;
	font-weight:bold;
	font-size:22px;
	margin: 2% 0;
	padding: 2% 0 ;
	color:#bc9f39;
	text-align:center;
	border-top: #bc9f39 solid 1px;
	border-bottom: #bc9f39 solid 1px;
	font-size: 140%;
	font-family: century,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
	z-index: 2;
	}
	
	.float{ margin-top: -8% !important;}
	
	#lirio_img01 { z-index: 1;}
	
	#history { width:90%; margin: 0 auto 0; z-index: 3;}
	
	#history_text { float:left; width: 50%; margin-right:5%;}
	#history_text dd { margin-bottom: 5%;}
	#history_images { float:left; width: 45%; margin-top: -8% !important;}
	#history_images li { width: 60%;}
	#history_images li.image01 { float:left;}
	#history_images li.image02 { float:right; margin: -25% 5% 0 0;}
	#history_images li.image03 { float:left; margin: -20% 0 0 5%;}
	#history_images li.image04 { float:right; margin: -20% 0 0 0;}
	#history_images li.image05 { float:left; margin: -20% 0 0 0;}
	#history_images li.image06 { float:right; margin: -20% 5% 0 0;}
	
	.lirio_subtitle { font-size: 140%; width:670px; margin: 0 0 20px; font-family: century,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif; text-align:left;}
	
	#map { width: 90%; margin: 0 auto 0;}
	
/*	ふきだし					*/
/*-----------------------------------------------------	*/
	.tatoeba {
	width: 90%;
	margin: 3% auto 3%;
	padding: 2% 3% 3%;
	box-shadow: 0px 0px 5px rgba(102, 68, 0, 0.3);
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#030200+0,37271a+100 */
	background: #efc880; /* Old browsers */
	background: -moz-linear-gradient(top, #f4d7a1 0%, #efc880 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #f4d7a1 0%,#efc880 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #f4d7a1 0%,#efc880 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4d7a1', endColorstr='#efc880',GradientType=0 ); /* IE6-9 */
	color:#666;
	border-radius:10px;
	}

	.tatoeba_subtitle { font-size: 130%; width:100%; margin: 0 0 20px; font-family: century,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif; text-align:left;}
	
	.tatoeba .images_box {
	float:left;
	width: 40%;
	}

	.tatoeba .right_box {
	float:left;
	width: 60%;
	padding-left: 20px;
	margin-bottom: 20px;
	}

	.tatoeba .right_box .border_box {
	padding: 8px 0;
	border-top: #bc9f39 double 1px;
	border-bottom: #bc9f39 double 1px;
	}

/*	ふきだし					*/
/*-----------------------------------------------------	*/

.balloon {
 	position: relative;
	display: inline-block;
	margin: 0 10px 10px 0;
	padding: 2px 0 5px;
	width: 100px;
	height: 60px;
	line-height: 60px;
	vertical-align: middle;
	text-align: center;
	color: #FFF;
	font-size: 90%;
	font-weight: bold;
	background: #bc9f39;
	border-radius: 50%;
	box-sizing: border-box;
	}

.balloon:before{
	content: "";
	position: absolute;
	bottom: -9px;
	right: -9px;
	margin-top: -15px;
	border: 15px solid transparent;
	border-left: 15px solid #bc9f39;
	z-index: 0;
	-ms-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	}
	
/*	hp_link_box					*/
/*-----------------------------------------------------	*/
	
.hp_link_box { width: 90%; margin: 0 auto 5%;}
.hp_link_btn img { float:left; width: 49%; margin: 0 2% 0 0; }
.hp_link_box .lirio img { float:left; width: 49%; margin: 0 0 0 0; }


/*------#footer ------*/

div#footer {
	float: left;
	width: 100%;
	height: auto;
	color: #fff;
	background-color: #333;
	text-align:center;
	font-size:80%;
	}

/*-----------------------------------------------------	*/
/*	for 800px - 1200px		*/
/*-----------------------------------------------------	*/

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

#wrapper, #wrapper_inner {
	width: 100%;
	height: auto;
    left: 0;
    position: static;
	margin: 0 auto;
}

div#content {
	width: 100%;}

.row {
	max-width:95%;
	margin: 0 auto 0;
}

.box01 dl dt { float:left; width: 15%; margin-right: 5%;}
.box01 dl dd { float:left; width: 80%;}
}


@media screen and  (min-width: 1000px) {
.pc-view { display:block; }
.sp-view { display:none; }
}

@media screen and (max-width: 1000px){	
.pc-view { display:none; }
.sp-view { display:block; }
}

@media screen and (min-width: 700px){	
  .br-pc { display:block; }
  .br-sp { display:none; }
  .pc-700 { display:block; }
  .sp-700 { display:none; }
}

@media screen and (max-width: 700px){	
  .br-pc { display:none; }
  .br-sp { display:block; }
  .sp-view { display:none; }
  .pc-700 { display:none; }
  .sp-700 { display:block; width: 100%; margin: 2% auto;}
  .rogo { width: 100%;}
  .tatoeba .images_box { width: 100%;}
  .tatoeba .images_box img { display:block; margin: 2% auto;}
  .tatoeba_subtitle { width: 100%; margin: 2% auto; font-size: 115%;}
  .tatoeba .right_box { width: 100%; margin-top: 5%;}

  .lirio_subtitle { font-size: 110%; width:100%;}
	#history_text { float:left; width: 53%; margin-right:2%;}
  	#history_images { float:left; width: 45%;}
	#history_images li { width: 100%;}
	#history_images li.image01 { float:none;}
	#history_images li.image02 { float:none; margin: 0;}
	#history_images li.image03 { float:none; margin: 0;}
	#history_images li.image04 { float:none; margin: 0;}
	#history_images li.image05 { float:none; margin: 0;}
	#history_images li.image06 { float:none; margin: 0;}

/*	hp_link_box					*/
/*-----------------------------------------------------	*/
	
.hp_link_box { width: 90%; margin: 0 auto 5%;}
.hp_link_btn img { float:none; width: 100%; margin: 0 0 2% 0; }
.hp_link_box .lirio img { float:left; width: 100%; margin: 0 0 0 0; }

}


/* ------ 共通 ------ */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin:0;
	padding:0;
}

li { list-style:none; }

* {-webkit-box-sizing: border-box;
   -ms-box-sizing: border-box;
   -moz-box-sizing: border-box;
   -o-box-sizing: border-box;
   box-sizing: border-box;
  }

/*----clearfix----*/

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}

.clearfix {
	display: inline-table;
	min-height: 1%;
}

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */


/*-----page-top-----*/

.pagetop {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 5px;
}
.pagetop a {
    display: block;
	filter:alpha(opacity=90);
    -moz-opacity: 0.9;
    opacity: 0.9;
}
.pagetop a:hover {
    display: block;
	filter:alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
}
