@charset "utf-8";

/*コンテナー（HPを囲むブロック）
---------------------------------------------------------------------------*/
#container {
	width: auto;
	margin: 15px;
}
/*h1タグの設定*/
#container h1 {
	display: none;
}

/*ログインボタン
-------------------------------------------------------------------------
#login_small {
	display: unset;
}
*/

/*ヘッダー（サイト名ロゴが入ったブロック）
---------------------------------------------------------------------------*/
header {
	width: auto;
	background-size: 60%;	/*背景画像をウィンドウに対して80％に*/
	border: none;
	border-bottom: 1px solid #FFF;	/*下側の線の幅、線種、色*/
}

/*上部のメインメニュー
---------------------------------------------------------------------------*/
/*メニューブロックの設定*/
nav#menu ul {
	height: auto;
	overflow: hidden;
}
/*メニュー１個ごとの設定*/
nav#menu ul li {
	width: 50%;
}
nav#menu ul li a {
	border: none;
	border-bottom: 1px solid #FFF;	/*下側の線の幅、線種、色*/
}
/*奇数番目のメニューの設定(※１個目の「ホーム」メニューが非表示になっている為、この場合はサービスとお問い合わせが奇数番目となる。)*/
nav#menu ul li:nth-child(odd) {
	border-left: 1px solid #FFF;	/*左側の線の幅、線種、色*/
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
/*１個目の「ホーム」メニューの設定*/
nav#menu ul li:first-child {
	display: none;	/*メニュー数を偶数にする為、ホームのみ非表示にしています。表示させたいならこの１行削除。*/
}

/*コンテンツ（main,subを囲むブロック）
---------------------------------------------------------------------------*/
#contents {
	width: auto;
}



/*トップページのメイン画像
---------------------------------------------------------------------------*/
#mainimg {
	height: auto;
	width: 100%;
}
#slide_image {
	height: auto;
	width: 100%;
	position: relative;
}
#slide_image2 {
	height: auto;
	width: 100%;
	position: absolute;
	left:0px;
	top:0px;
}


/*main,subコンテンツ
---------------------------------------------------------------------------*/
#main, #sub {
	float: none;
	width: auto;
}

/*service.html内の各ブロック（※タイプ１）
---------------------------------------------------------------------------*/
/*各ボックスの設定*/
#main section.list1 section {
	width: 45%;	/*ボックスの幅*/
}

#main section.list4 section {
	width: 100%;	/*ボックスの幅*/
}




/*スマホとタブレットだけに見せる申し込みボタン*/
#main p.order {
	/*display: none;*/
   max-width: 480px; /* 最大幅 */
}
#main p.order img {
   width: 100%;
   height:auto;
}





/*その他
---------------------------------------------------------------------------*/
/*写真の設定*/
img.wa {
	width: 100%;
	height: auto;
}
/*<body class="s-n">指定の場合にsubブロックを表示させない設定*/
body.s-n #sub {
	display: none;
}



p.resizeimage400 {
  max-width: 480px; /* 最大幅 */
   /*min-width: 220px;  最小幅 */
}
p.resizeimage400 img {
  width: 100%;
  height:auto;
}






.FreezePaneOff{
   visibility: hidden;
   display: none;
   position: absolute;
   top: -100px;
   left: -100px;
}

.FreezePaneOn{
   position: absolute;
   top: 0px;
   left: 0px;
   visibility: visible;
   display: block;
   width: 100%;
   height: 100%;
   background-color: #666;
   z-index: 999;
   filter:alpha(opacity=85);
   -moz-opacity:0.85;
   padding-top: 20%;
}

.InnerFreezePane{
   text-align: center;
   width: 66%;
   background-color: #1d8ade;
   color: White;
   font-size: large;
   border: dashed 2px #003399;
   padding: 9px;
}


/*スマホとタブレットでは表示しないブロック*/
#main p.pc_only {
	display: none;
}








.chat-box    {
    width: 100%;
}

.header    {
    padding: 10px;
    color: white;
    font-size: 14px;
    font-weight: bold;
    background-color: #6d84b4;
}

.messages    {
    padding: 10px;
    /*height: 800px;*/
    background-color: green;
    background-color: rgb(237, 239, 244);
    border-width: 1px;
    border-color: black;
    border-style: solid;
    /*overflow-y: scroll;*/
}

.messages ul    {
    padding: 0px;
    list-style-type: none;
}

.messages ul li    {
    height: auto;
    margin-bottom: 10px;
    clear: both;
    padding-left: 10px;
    padding-right: 10px;
}

.messages ul li span    {
    display: inline-block;
    max-width: 250px;
    background-color: white;
    padding: 5px;
    border-radius: 4px;
    position: relative;
    border-width: 1px;
    border-style: solid;
    border-color: grey;
}

.messages ul li span.left    {
    float: left;
}

.messages ul li span.left:after    {
    content: "";
    display: inline-block;
    position: absolute;
    left: -8.5px;
    top: 7px;
    height: 0px;
    width: 0px;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-right: 8px solid white;
}

.messages ul li span.left:before    {
    content: "";
    display: inline-block;
    position: absolute;
    left: -9px;
    top: 7px;
    height: 0px;
    width: 0px;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-right: 8px solid black;
}

.messages ul li span.right:after    {
    content: "";
    display: inline-block;
    position: absolute;
    right: -8px;
    top: 6px;
    height: 0px;
    width: 0px;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 8px solid #dbedfe;
}

.messages ul li span.right:before    {
    content: "";
    display: inline-block;
    position: absolute;
    right: -9px;
    top: 6px;
    height: 0px;
    width: 0px;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 8px solid black;
}

.messages ul li span.right    {
    float: right;
    background-color: #dbedfe;
}

.clear    {
    clear: both;
}

.input-box    {
    background-color: white;
    height: 50px;
    padding: 0px;
}

.input-box textarea    {
    padding: 0px;
    width: 478px;
    height: 100%;
    display: inline-block;
    outline: 0px;
    border-width: 0px;
    resize: none;
    border-width: 1px;
    border-color: black;
    border-style: solid;
    font-size: 12px;
    padding: 10px;
    border-top-width: 0px;
}


.last_post    {
    font-size: 10px;
    font-weight: bold;
}



#loading {
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   position: fixed;
   display: block;
   opacity: 0.7;
   background-color: #fff;
   z-index: 99;
   text-align: center;
}

#loading-image {
  position:absolute;
  width:356px; /*image width */
  height:356px; /*image height */
  left:50%; 
  top:50%;
  margin-left:-178px; /*image width/2 */
  margin-top:-178px; /*image height/2 */
  z-index: 100;
}
