@charset "UTF-8";

body {
	color: #333;
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","游ゴシック",YuGothic,"メイリオ",Meiryo,Verdana,sans-serif;
	font-size: 2.0em;
	line-height: 2;
	text-align: left;
	color: #555;
	-webkit-text-size-adjust: 100%;
}

#container {
	overflow: hidden;
	margin: auto;
	width: 640px;
}

.ttl01 {
	height: 238px;
	background: url(../img/ttl01_bg.gif) left top repeat-x;
}
.ttl02 {
	height: 200px;
	background: url(../img/title_bg.png) left top repeat-x;
}

.txtbold {
	color: #34409b;
	font-weight: bold;
}


/* menu
------------------------------------------------------------------------------------*/
#menu{
  width: 100%;
	z-index: 1;
	background: #191970;
}
#menu ul{
	position: relative;
	width: 1000px;
	margin: 0 auto;
	color: #fff;
	font-size: 80%;
}
#menu ul li{ float: left; padding: 5px 10px;}
#menu ul li.order {
	color: #fff;
	font-size: 100%;
	position: absolute;
	right: 0;
	font-weight: bold;
	padding: 0;
}
#menu ul li.order a {
	background: #c62547 url(../img/arrow_01.gif) no-repeat scroll 10px center;
	display: inline-block;
	padding: 5px 10px 5px 30px;
	color: #fff;
}
#menu ul li.order a:hover{
	background: #dcad05 url(../img/arrow_01.gif) no-repeat scroll 10px center;
}

/* HEADER
------------------------------------------------------------------------------------*/
header{
	margin: 0px auto 27px auto;
	width: 100%;
	height: 145px;
	border-bottom: solid 1px #8ba1ef;
}
#iframe_wrap{
	margin: auto;
	width: 640px;
}
#head_iframe{
	width: 640px;
	height: 145px;
}

/* CONTENTS
------------------------------------------------------------------------------------*/
.contents {
	width: 640px;
	margin: 0 auto;
	background: #fff;
}

.contentsbox {
	width: 1000px;
	margin: 0 auto;
	background: #fff;
	padding: 0 0 0 0;
}

/* section 余白共通 */
/* section 余白共通 */
.text_area { padding: 0px 20px; }
.text_area2 { padding: 0px 0px 20px 20px; line-height:40px;}
.bg_area {
	padding: 0px 20px;
}
.text_area p,
.bg_area p { margin-bottom: 40px;}
.text_area p:last-child,
.bg_area p:last-child { margin-bottom: 0;}


/* イメージ */
.img_05 { background: url(../img/img_05.png) no-repeat top 60px right 0;}

/* 無料動画 */
.free_movie {
	background: url(../img/movie_bg.png) no-repeat top center;
	text-align: center;
	margin: 0px 0px 50px 0px;
	width: 640px;
	height: 320px;
}
.free_movie iframe {
    margin: 25px 75px;
}



/* 前書き */
.bgg_area {
	border: 10px solid #f5f5f5;
	margin: 50px 0 ;
	background:   url(../img/img02.png) no-repeat right center , url(../img/bg_01.gif);
/*	background:url(../img/bg_01.gif) ;*/
	padding: 40px;
}
.bgg_area p { margin-bottom: 30px;}
.bgg_area p:last-child { margin-bottom: 0;}


/* コメント */
.comment {
	border: 1px dashed #dedede;
	background: #f5f1ee;
	padding: 30px 30px 30px 300px;
	min-height: 150px;
	max-width: 900px;
	position: relative;
	margin: 50px 0;
}
.comment img {
	position: absolute;
	top: -30px;
	left: -50px;
}
.comment2 {
	border: 1px dashed #dedede;
	background: #f5f1ee;
	padding: 30px 300px 30px 30px;
	max-width: 900px;
	position: relative;
	margin: 50px 0;
}
.comment2 img {
	position: absolute;
	top: -30px;
	right: -50px;
}

/* プロフィール */
.profile {
	overflow: hidden;
	border: 3px solid #8ba1ef;
	margin: 0px 0px 50px 0px;
	font-size: 75%;
	background: #fff;
}
.profile img {
	width: 100%;
}
.profile .inner .photo_01,
.profile .inner .photo_02 {
	width: 100%;
}
.profile .inner { padding: 15px;}
.profile .inner .photo {
	display: table;
	margin: 0px 0px 10px 0px;
	width: 100%;
}
.profile .inner .photo img{
	display: table-cell;
	max-width: 198px;
}
.profile .inner .photo #photo_right{
	display: table-cell;
	vertical-align: middle;
}
.profile .inner .fr { float: left; width: 55%;}
.profile .inner .disc { list-style-type: disc; padding: 0px 10px 10px 15px;}
.profile .inner dl dt { width: 5.5em; float: left;}
.profile .inner dl dd { display: block;}

/* ブレッド */
ul.bled { border: 10px solid #008b8b;}
ul.bled li { border-bottom: 5px solid #008b8b; padding: 20px 20px 20px 100px; line-height: 1.6;}
ul.bled li:last-child { border-bottom: 0;}
ul.bled li .mincho { color: #51423d;}
ul.bled li.bled1 { background: url(../img/bled1.png) no-repeat left center;}
ul.bled li.bled2 { background: url(../img/bled2.png) no-repeat left center;}
ul.bled li.bled3 { background: url(../img/bled3.png) no-repeat left center;}
ul.bled li.bled4 { background: url(../img/bled4.png) no-repeat left center;}
ul.bled li.bled5 { background: url(../img/bled5.png) no-repeat left center;}
ul.bled li.bled6 { background: url(../img/bled6.png) no-repeat left center;}
ul.bled li.bled7 { background: url(../img/bled7.png) no-repeat left center;}
ul.bled li.bled8 { background: url(../img/bled8.png) no-repeat left center;}
ul.bled li.bled9 { background: url(../img/bled9.png) no-repeat left center;}

/* ボタンアニメーション */
#btn{
	margin: 50px 0 70px;
	text-align: center;
	height: 140px;
}
#btn a img{
	height: 140px;
	width: 770px;
	margin: 0;
}


/* present */
.present {
	background: url(../img/present.png) no-repeat top left;
	padding: 570px 50px 50px 50px;
	margin-top: 50px;
}




/* FOOTER
------------------------------------------------------------------------------------*/
footer {
	border-top: #e7e7e7 solid 10px;
	padding: 10px 0;
	background: #fff;
}

footer .inner{
	width: 1000px;
	margin: 0 auto;	
}

/*toggle
-----------------------------------------*/
.view_toggle_btn{
	cursor: pointer;
	padding: 4px 8px;
	margin: 0px 0px 20px 0px;
	border: solid 1px #8ba1ef;
	color: #8ba1ef;
	text-align: center;
}
.view_toggle_trg{
	display: none;
}

/*ボタンアニメーション
-----------------------------------------*/
/* ボタンをバウンドさせる */
.is-bounce {
  animation: bounce 4s infinite;
  -moz-animation: bounce 4s infinite;
  -webkit-animation: bounce 4s infinite;
  -webkit-animation-delay: 4s;
  animation-delay: 4s;
}
@-webkit-keyframes bounce {
  0%, 4%, 10%, 18%, 100% {-webkit-transform: translateY(0);}
  5% {-webkit-transform: translateY(-6px);}
  12% {-webkit-transform: translateY(-4px);}
}
@keyframes bounce {
  20%, 24%, 30%, 34%, 100% {-webkit-transform: translateY(0);transform: translateY(0);}
  25% {-webkit-transform: translateY(-10px);transform: translateY(-10px);}
  32% {-webkit-transform: translateY(-4px);transform: translateY(-4px);}
}
/* アニメーションを遅延させる */
.is-bounce + .is-bounce {
  -webkit-animation-delay: .5s;
  animation-delay: .5s;
}
 
/*電話ボタン
-----------------------------------------*/ 
#sp{
	display: none;
}
@media screen and (min-width:0px) and (max-width:640px){
	#sp{
		display: block;
	}
}


/*pagetop
-----------------------------------------*/
#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	font-size: 10px;
	z-index: 1;
}
#page-top a {
	background: #666;
	text-decoration: none;
	color: #fff;
	width: 100px;
	padding: 25px 0;
	text-align: center;
	display: block;
	border-radius: 5px;
}
#page-top a:hover {
	text-decoration: none;
	background: #999;
}