@charset "utf-8";


/*============================================================
3.Individual.css
--------------------------------------------------------------

File Name:	individual.css
Summary:	ページ毎、あるいはパーツ毎に固有のスタイル
Created:	2016/11/15
Modified:	2025/10/16
							2018/10/10[実績紹介追加]
							2018/10/15[アート書のサムネイルのスタイルを追加]
							2019/04/08[トップページにピックアップ情報用のスタイルを追加]
							2020/05/13[お知らせページを開設しそれに伴うスタイルの追加]
							2020/06/05[ミニアート書を開設しそれに伴うスタイルの追加]
							2020/07/06[写経の代筆ページを開設しそれに伴うスタイルの追加]
							2021/09/25[採用募集ページのスタイルをSTAFFに追加]
							2022/02/19[owner_activityのスタイルを新規に追加]
							2023/08/29[image_listのスタイル（画像をflexで横並び）を新規に追加]
							2025/02/11[ホームの実績紹介で仕様するolのスタイルを新規に追加]
							2025/03/17[実績紹介のページのスタイルを新規に追加]
                            2025/05/15[手書きオーダーのページのスタイルを新規に追加]
                            2025/06/03[手書きオーダーのページに料金案内のスタイルを新規に追加]
                            2025/07/11[ホームのニュース部分のデザイン調整レイアウトを新規に追加]
                            2025/10/16[FAQ用のスタイルを新規に追加]
============================================================*/



/*============================================================
目次
--------------------------------------------------------------
	
3.	Indivdual Style

============================================================*/



/*============================================================
3-0.	Common Style
------------------------------------------------------------*/


/* 
全階層共通で使用
-----------------------------  */

.bn_image img{
    max-width: 100%;
    height: auto;
    text-align: center;
}


/*
サブコンテンツ部分の余白やボーダーの調整
----------------------*/

#main_contents .information{
	border: 2px solid #ccc;
	margin: 0 0 50px;
	clear: both;
	border-radius: 5px;	
	padding: 15px 15px;
    background-color: #fff;
}

#main_contents .information h3{
    font-size: 22px;
    font-size: 2.2rem;
	margin: 0 0 15px;
    border-bottom: 2px dashed #ccc;
    padding-bottom: 5px;
}



.sub_mini_section{
	border: 2px solid #ccc;
	border-radius: 5px;
	padding: 10px;
	margin: 0 auto 30px;
}

.sub_mini_section h3{
	font-size: 24px;
	font-size: 2.4rem;
	margin: 0 0 10px;
	border-bottom: 1px dashed #ccc;
}



/*
画像をflexで横並びにする
----------------------*/

.image_list{
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

.image_list li{
}

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

.image_shadow li img{
    box-shadow:0px 3px 7px -2px #808080;
}




.sample_image_list{
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

.sample_image_list li{
    width: 45%;
    margin: 0 15px 15px 15px;
}

.sample_image_list li img{
    max-width: 100%;
    height: auto;
    box-shadow:0px 3px 7px -2px #808080;
}






@media (max-width:930px){
    .sample_image_list{
    display: block;
    }
    .sample_image_list li{
    width: 100%;
    margin: 0 0 15px 0;
    }
}



@media (max-width:479px){

    .image_list{
    display: block;
    }
    
    .sample_image_list{
    display: block;
    }
    .sample_image_list li{
    width: 100%;
    margin: 0 0 15px 0;
    }
    
}





/*============================================================
3-1.	Home Style
------------------------------------------------------------*/


/* 
リードコンテンツ
--------------------- */

#catch_area{
	max-width:1200px;
	margin:150px auto 100px;
	zoom:1;
}

#catch_area:before,
#catch_area:after{
	display:table;
	content:"";
}

#catch_area:after{
	clear:both;
}

#catch_area .main_catch{
	width: 63%;
	float: left;
}

#catch_area .main_catch h2{
	margin: 0 0 50px 0;
}

#catch_area .main_catch h2:before{
	content: "";
	width: 20px;
	height: 5px;
	background-color: #941c52;
	display: inline-block;
	margin-right: 18px;
	margin-bottom: 10px;
}

/* ムービー予告画像用 */
.movie{
	margin-bottom: 25px;
}

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


#catch_area .main_catch .movie_area{
	margin: 0 30px 25px 0px;
}

#catch_area .main_catch p{
	font-size: 16px;
	font-size: 1.6rem;
	margin: 0 30px 15px;
}


section#owner_info{
	width: 33%;
	float: right;
}

#owner_profile{
	margin-top: 50px;
	padding: 15px 27px;
	border: 3px solid #d9d9d9;
	border-radius: 10px;
}

#owner_profile h2{
	font-size: 22px;
	font-size: 2.2rem;
}

#owner_profile p{
	font-size: 16px;
	font-size: 1.6rem;
}

#owner_profile .profile_data{
	font-size: 16px;
	font-size: 1.6rem;
	margin:25px 0 25px 0;
}

#owner_profile .profile_data th{
	font-weight: normal;
	padding: 0 16px 5px 0;
}

#owner_profile .profile_data td{
	padding: 0 0 5px 0;
}

#owner_profile .go_to_detail{
	margin: 30px 0;
	text-align: right;
}

#owner_profile .go_to_detail a{
	text-decoration: none;
	border: 1px solid #941c52;
	padding: 3px 10px 4px 27px;
	position: relative;
}

#owner_profile .go_to_detail a:hover{
	border-color: #c45788;
}

#owner_profile .go_to_detail a:before{
	font-family:"FontAwesome";
	font-size:18px;
	font-size:1.8rem;
	content:"\f105";
	position:absolute;
	left:11px;
	top:50%;
	margin-top:-9px;
	line-height: 1;
}




section.owner_activity{
	border: 1px solid #666;
	border-radius: 5px;
	padding:15px 15px 10px;
	/*text-align: center;*/
	margin: 15px auto 15px;
}

section.owner_activity a:hover img{
	opacity: 0.6;
}

section.owner_activity a:visited{
	color: #333;
}

section.owner_activity a:hover{
	color: #b0494a;
}


.latest_works{
	text-align: left;
}

.latest_works h2{
	font-size: 18px;
	font-size: 1.8rem;
}

ul.ko-chou_works{
	display: flex;
}


ul.ko-chou_works li img{
	max-width: 100%;
	height: auto;
	border: 1px solid #ccc;
}




/* ピックアップニュース用2019.04.08追加 */

.pickup_info{
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
  padding: 20px;
  margin-bottom: 30px;
  max-width: 100%;
}


#catch_area .main_catch .pickup_info h3{
  font-size: 20px;
  font-size: 2.0rem;
  border-left: 5px solid #c60;
  padding-left: 10px;
  max-width: 0 0 15px 0;
}

#catch_area .main_catch .pickup_info p{
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 1.8;
  margin: 0 0 1em 0;
}


.flexbox {
  display: flex;
  flex-wrap:wrap;
  align-items: flex-start;
}

.flexbox > div:first-child{
  margin-right: 25px;
  display: inline-block; /* 幅は中身に応じて決まる */
  flex-shrink: 0; /* テキストに押されて縮まない */
  max-width: 300px;
}

.flexbox > div:last-child {
  flex-grow: 1;
  min-width: 0;
  max-width: calc(100% - 325px); /* ←画像幅+余白の合計ぶんを引く */
}

.flexbox img {
  display: block;
  height: auto;
  max-width: 100%;
  border-radius: 8px;
}


/* モバイル対応 */
@media (max-width: 768px) {
  .flexbox {
    flex-direction: column;
  }

  .flexbox > div:first-child {
    margin-right: 0;
    margin-bottom: 20px;
  }
  .flexbox > div:last-child {
	max-width: 100%;
  }
}


/* ============================================================
  実績エリア：最新1件フル表示＋以降は開閉（details）
  2025/10/27 統合・整理版
============================================================ */

.news_area{
  max-width: 1200px;
  margin: 50px auto 0;
  padding: 0 0 10px;
}

/* 見出し直下のガイド */
.news_notice{
  font-size: 1.4rem;
  color: #777;
  margin: 0 0 12px 4px;
  font-style: italic;
}

/* --- 最新1件（大きめカード） --- */
.news_feature{
  /*display: grid;
  grid-template-columns: minmax(260px, 380px) 1fr; 
  gap: 24px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0,0,0,.08);
  padding: 18px;
  margin: 10px 0 28px;*/
  display: flex;
  align-items: flex-start;
  gap: 24px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0,0,0,.08);
  padding: 18px;
  margin: 10px 0 28px;
}


.news_feature__body,
.news_item__text{
	/*display: flex;
	flex-direction: column;
	gap: 8px;*/
	flex: 1 1 auto;
    min-width: 260px;         /* 文章が極端に窮屈にならない下限 */
}

.news_title {
	font-size: 1.8rem;
	margin: 6px 0 0;
	color: #333;
}

.news_date {
	font-size: 1.3rem;
	color: #777;
	margin: 0;
}

.news_text {
	font-size: 1.5rem;
	line-height: 1.8;
	color: #555;
}


.news_feature img,
.news_item__content img{
  /*width: auto; 
  max-width: 100%;
  height: auto;
  max-height: 300px;
  display: block;
  margin: 0 auto; */

  flex: 0 0 auto;           /* 画像の自然幅を尊重（縮まず、伸びず） */
  height: auto;
  max-height: 300px;        /* 縦の圧迫を抑制：必要なら 260〜340px で調整 */
  width: auto;              /* 比率維持（幅は自動） */
  max-width: 420px;         /* 極端に横長のときの上限 */
  display: block;
  background-color: #fafafa;
  border: 1px solid #eee;
  border-radius: 6px;
}

/* --- 2件目以降のリスト（アコーディオン） --- */
.news_list{ display:flex; flex-direction:column; gap:12px; }

.news_item{
  background:#fff;
  border:1px solid #ddd;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 2px 8px rgba(0,0,0,.05);
}

/* summary はクリック領域。ホバー/フォーカスで分かりやすく */
.news_item > summary{
  list-style:none;
  cursor:pointer;
  padding:14px 48px 14px 16px;
  position:relative;
  display:flex;
  align-items:center;
  gap:12px;
  transition: background-color .2s ease;
}
.news_item > summary::-webkit-details-marker{ display:none; }
.news_item > summary:hover{ background-color:#f9f4f6; }
.news_item > summary:focus-visible{
  outline: 2px solid #941c52;
  outline-offset: 2px;
}

.news_item__title{ font-size:1.6rem; color:#333; flex:1; }
.news_item__date{ font-size:1.3rem; color:#777; }

/* 矢印（>）: 枠線で描画。右端中央に固定 */
.news_item__chev{
  position:absolute; right:16px; top:50%;
  transform: translateY(-50%) rotate(-45deg);
  width:12px; height:12px;
  border-right:2px solid #941c52;
  border-bottom:2px solid #941c52;
  transition: transform .2s ease;
}
.news_item[open] > summary .news_item__chev{
  transform: translateY(-50%) rotate(45deg);
}

/* 展開エリア */
.news_item__content{
  display:grid;
  grid-template-columns: 220px 1fr;
  gap:16px;
  padding: 0 16px 16px 16px;
}
.news_item__text p{ margin:8px 0 0; font-size:1.5rem; line-height:1.8; color:#555; }

/* 余白・見出しとの距離（既存トーンと整合） */
#opening_movie .news_area h2{
  font-size: 24px;
  border-left: 6px solid #941c52;
  padding-left: 10px;
  margin: 28px 0 12px;
}

/* --- 開閉式（.news_item__content）の画像と本文が重なる対策 --- */
.news_item__content {
  align-items: start;         /* ← 高さの基準を画像上端に合わせる */
}

.news_item__content img {
  flex-shrink: 0;             /* ← 画像が圧縮されないようにする */
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  object-fit: contain;        /* 比率維持・トリミングなし */
}

/* Gridが正しく縦方向に高さを認識できるよう明示 */
.news_item__content > * {
  min-height: 0;              /* ← overflow問題の防止 */
}


/* ------------------ レスポンシブ ------------------ */
@media (max-width: 980px){
.news_feature {
		/*grid-template-columns: 1fr;*/
		display: grid;          /* ここで1カラムへ切替 */
    	grid-template-columns: 1fr;
	}
}

@media (max-width: 768px) {
	.news_item__content {
		grid-template-columns: 1fr;
	}


	.news_feature img,
	.news_item__content img{
		max-height: 240px;
		margin: 0 auto;
	}

	.news_item>summary {
		padding: 12px 44px 12px 14px;
	}
}

@media (max-width: 575px){
  .news_title{ font-size:1.6rem; }
}

/* 動きを抑えたい利用者向け */
@media (prefers-reduced-motion: reduce){
  .news_item__chev,
  .news_item > summary{ transition: none; }
}







/* 賞状紹介のスタイル */

body#home #main_topics{
	background-color:#f5f1c1;
	background-color: rgba(245,251,193,0.25);
	margin:0 auto 100px;
}


body#home #main_topics h1{
	font-size: 46px;
	font-size: 4.6rem;
	text-align: center;
	margin: 0 0 40px;
}

body#home #main_topics h1 br{
	display: none;
}

body#home #main_topics h1 span{
	font-size: 36px;
	font-size: 3.6rem;
}

body#home #main_topics h2{
	font-size: 30px;
	font-size: 3.0rem;
}

body#home #main_topics .main_section{
	max-width: 1265px;
	margin: 0 auto;
}

body#home #main_topics .sample_image{
	max-width: 874px;
	width: 69%;
	float: left;
}

body#home #main_topics .sample_image img{
	max-width: 874px;
	width: 100%;
	height: auto;
}

body#home #main_topics .contents_text{
	width: 27%;
	padding-top: 25px;
	float: right;
}

body#home #main_topics .contents_text p{
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 2.3;
}

body#home #main_topics .contents_text .go_to_detail{
	margin: 50px 0 50px 0;
}


/* 画面いっぱいの画像とテキスト */

.image_and_text{
	max-width: 1400px;
	clear: both;
	margin: 0 auto 100px;
}

.image_and_text:after{
	content:"";
	display: table;
	clear: both;
}

.image_and_text .image_area{
	width: 55%;
	float: right;
	text-align: right;
	padding: 0 35px 0 0;
}

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

.image_and_text .text_area{
	width: 45%;
	float: left;
	padding: 80px 30px 0 82px;
}

.image_and_text .text_area p{
	font-size: 16px;
	font-size: 1.6rem;
}

.image_and_text .text_area h2{
	margin-top: 0;
}

.reverse .image_area{
	float: left;
	padding: 0 0 0 35px;
}

.reverse .text_area{
	float: right;
}


/* 2025.0520追加 */

.cali-intro{
	max-width: 1400px;
    background-color: #eee;
	clear: both;
    display: flex;
    justify-content:center;
    padding: 30px 0 30px;
    margin: 0 auto 100px;
}

.cali-intro_image{
	padding: 0 35px 0 0;
}

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

.cali-intro_content{
    max-width: 600px;
}

.cali-intro_content p{
    margin: 0 0 0 0;
}


@media (max-width:930px){
    .cali-intro{
        flex-wrap: wrap;
        padding: 0 15px;
    }
    
    .cali-intro_content{
        max-width: 100%;
    }
    
}

@media (max-width:768px){

    .cali-intro_content p{
        display: inline;
    }

    .cali-intro_content {
    line-height: 1.6;
  }

}


/* アート書 */

#art_contents{
	background-color: #e3d8aa;
	background-color: rgba(227,216,170,0.25);
	padding: 50px 0 25px;
}

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

#art_contents h2{
	font-size: 30px;
	font-size: 3.0rem;
	margin-left: 25px;
}

#art_contents h2 br{
	display: none;
}

.bg_section{
	background-color: #e3d8aa;
	background-color: rgba(227,216,170,0.25);
	padding: 50px 0 25px;
}


/* 20250211追加
実績紹介部分のリストのスタイル */

.number_count{
    font-size: 12px;
    font-size: 1.2rem;
    margin: 0 0 0 0;
    padding: 0 0 0 0.5em;
}

.number_count li{
    margin: 0 0 10px 1em;
    padding: 0 0 0 0.3em;
}





@media (max-width:1200px) {
	
	#catch_area{
		padding: 0 15px;
	}
	
}

@media (max-width:1140px) {
	
	#catch_area{
		margin: 100px 0 50px;
	}
	body#home #main_topics .sample_image{
		width: 60%;
	}
	body#home #main_topics .contents_text{
		width: 36%;
	}
	body#home #main_topics .contents_text{
		padding: 0 15px 0 15px;
	}
	#main_topics .contents_text .go_to_detail{
		font-size: 18px;
		font-size: 1.8rem;
	}
	.image_and_text .text_area{
		padding-top: 25px;
	}
	
}


@media (max-width:1040px) {
	#catch_area .main_catch,
	#catch_area #owner_info{
		width: auto;
		max-width: 800px;
		margin-left: auto;
		margin-right: auto;
		float: none;
		clear: both;
	}
	
	body#home #main_topics h1{
		font-size: 36px;
		font-size: 3.6rem;
	}

	body#home #main_topics h1 span{
		font-size: 28px;
		font-size: 2.8rem;
	}
	
	body#home #main_topics .sample_image{
		width: 52%;
		float: left;
		padding-top: 50px;
		padding-left: 15px;
	}

	body#home #main_topics .contents_text{
		text-align: center;
		width: 45%;
		padding-top: 0;
		float: right;
	}
	
	body#home #main_topics .contents_text p{
		margin: 0 0 25px;
	}
	
}



@media (max-width:930px){
	body#home #main_topics h1{
		font-size: 32px;
		font-size: 3.2rem;
		text-align: center;
		margin: 0 0 25px;
	}

	body#home #main_topics h1 span{
		font-size:22px;
		font-size: 2.2rem;
	}
	
	#catch_area .main_catch,
	#catch_area #owner_info{
		width: 100%;
		float: none;
		clear: both;
	}
	
	body#home #main_topics h2{
		font-size: 28px;
		font-size: 2.8rem;
	}
	
	body#home #main_topics .contents_text .go_to_detail{
		margin-bottom: 0;
	}
	
	body#home #main_topics .contents_text{
		padding: 20px 30px 0;
	}
	
	body#home #main_topics .contents_text p{
		line-height: 1.8;
	}
	
	body#home #main_topics .contents_text p br{
		display: none;
	}
	
	#catch_area{
		margin: 25px 0 50px;
	}
	
	body#home #main_topics .sample_image,
	body#home #main_topics .contents_text{
		text-align: left;
		width: 100%;
		float: none;
		clear: both;
	}
	
	body#home #main_topics .sample_image{
		padding-top: 0;
	}
	
	.image_and_text{
		margin-bottom: 50px;
	}
	
	.image_and_text .image_area,
	.image_and_text .text_area{
		width: 100%;
		float: none;
		clear: both;
		margin: 0;
	}
	
	.image_and_text .image_area{
		padding: 0 15px;
	}
	
	.image_and_text .text_area{
		padding: 15px 15px 0 60px;
	}
	
	#art_contents h2{
		font-size: 28px;
		font-size: 2.8rem;
		margin: 0 10px 25px 25px;
	}
	
}


@media (max-width:479px){
	
	body#home #main_topics h1{
		font-size:30px ;
		font-size: 3.0rem;
	}
	
	body#home #main_topics h1 br{
		display: inherit;
	}
	
	body#home #main_topics .sample_image{
		padding: 0 15px;
	}
	
	#catch_area .main_catch h2{
		position: relative;
		border-top: 4px solid #941c52;
		border-bottom: 4px solid #941c52;
		padding: 15px 10px 15px 10px;
		margin: 0 -15px 25px;
	}
	
	#catch_area .main_catch h2:before{
		/*width: 50px;
		height: 2px;
		position: absolute;
		bottom: -10px;
		left: 0;
		margin-right: 0;
		margin-bottom: 0;*/
		display: none;
	}
	
	#catch_area .main_catch p{
		font-size: 14px;
		font-size: 1.4rem;
		margin: 0 5px 15px;
	}
	
	#owner_profile{
		padding: 10px 15px 5px;
		border: 3px solid #d9d9d9;
		border-radius: 10px;
	}

	#owner_profile h2{
		font-size: 16px;
		font-size: 1.6rem;
		margin: 0 0 15px;
	}

	#owner_profile p{
		font-size: 14px;
		font-size: 1.4rem;
	}

	#owner_profile .profile_data{
		font-size: 14px;
		font-size: 1.4rem;
		margin:15px 0 15px 0;
	}
	
	#owner_profile .go_to_detail{
		margin: 15px 0 10px;
	}
	
	body#home #main_topics{
		margin-bottom: 50px;
	}
	
	body#home #main_topics h2{
		font-size: 24px;
		font-size: 2.4rem;
		margin:15px 0 25px 0;
	}
	
	body#home #main_topics .contents_text p{
		font-size: 14px;
		font-size: 1.4rem;
	}
	
	.image_and_text{
		margin-bottom: 100px;
		padding-top: 15px;
		padding-bottom: 15px;
		border-bottom: 1px dashed #ccc;
	}
	
	.image_and_text .image_area{
		margin-bottom: 15px;
	}
	
	.image_and_text .text_area{
		padding: 0 30px;
	}
	
	.image_and_text .text_area h2{
		
	}
	
	.image_and_text .text_area p{
		font-size: 14px;
		font-size: 1.4rem;
	}
	
	.image_and_text .text_area .go_to_detail{
		margin: 25px 0;
	}
	
	#art_contents{
		padding: 25px 0;
	}
	
	#art_contents h2{
		font-size: 20px;
		font-size: 2.0rem;
		margin: 0 0 25px 0;
	}
	
	#art_contents h2 br{
		display: inherit;
	}
	
	#art_contents .go_to_detail{
		display: block;
		margin: 25px 0 15px;
	}
	
}



/*============================================================
3-2.	Shoujyou Style
------------------------------------------------------------*/

/*body#shoujyou #main_title h1{
	background-image:url(../../../shoujyou/images/mv_shoujyou_01.png);
	background-position: right top;
	background-repeat: no-repeat;
}*/


@media(max-width:1140px){
	
	#shoujyo_catch .page_catch_text{
		left: auto;
		right: 50px;
	}
	
	
}


/*============================================================
3-3.	Restaurant Style
------------------------------------------------------------*/

#restaurant_catch .page_catch_text{
	position: absolute;
	left: 50px;
	top: 50px;
	color: #fff;
	background-color: rgba(69,30,34,0.84);
	padding: 50px 50px 35px;
}

#restaurant_catch img{
	margin-left: -30px;
}

@media (max-width:1230px) {
	
	#restaurant_catch{
		padding-right: 10px;
	}
	
	#restaurant_catch img{
		margin-left: 0;
	}
	
}


@media (max-width:980px) {
	
	#restaurant_catch .page_catch_text{
		color: #646464;
		position: relative;
		right: auto;
		left: auto;
		top: auto;
		background-color: rgba(255,255,255,0.7);
		padding: 25px 10px 10px;
		margin-right: -10px;
	}

	
}




/*============================================================
3-4.	Office Style
------------------------------------------------------------*/


#office_catch .page_catch_text{
	position: absolute;
	left: 50px;
	top: 50px;
	color: #fff;
	background-color: rgba(30,41,69,0.84);
	padding: 50px 50px 35px;
}


@media (max-width:980px) {
	
	#office_catch .page_catch_text{
		color: #646464;
		position: relative;
		right: auto;
		left: auto;
		top: auto;
		background-color: rgba(255,255,255,0.7);
		padding: 25px 10px 10px;
	}

	
}


/*============================================================
3-5.	Art Style
------------------------------------------------------------ */

#art_catch .page_catch_text{
	position: absolute;
	left: auto;
	right: 50px;
	top: 50px;
	color: #fff;
	background-color: rgba(0,0,0,0.84);
	padding: 50px 50px 35px;
}

.art_list:after{
	content: "";
	display: table;
	clear: both;
}

.art_list{
	margin: 0 0 100px;
	border-bottom: 1px solid #ccc;
	padding: 0 0 75px 0;
	display: -webkit-flex;
	display: flex;
  -webkit-justify-content: center;
  justify-content: center;
}

.art_list:first-child{
	padding-top: 100px;
	border-top: 1px solid #ccc;
}

.art_list .image_area{
	margin: 0 50px 25px 0;
}


.art_list:nth-child(even) .image_area{
	-webkit-order:2;
	order: 2;
	margin: 0 0 25px 50px;
}


.art_list .image_area img{
	max-width: inherit;
}

.art_list .text_area{
	max-width: 550px;
}

.art_list .text_area h3{
	margin: 0 0 25px;
}

.art_list .text_area h4{
	font-size: 16px;
	font-size: 1.6rem;
	margin-bottom: 15px;
	border-left: 4px solid #941c52;
	padding:0 0 0 0.4em;
	line-height: 1;
}

.art_list section{
	margin: 25px 15px 25px;
}

.art_list section p{
	font-size: 14px;
	font-size: 1.4rem;
}

.art_list section .simple_table th,
.art_list section .simple_table td{
	padding-top: 8px;
	padding-bottom: 8px;
}

.art_list .text_area .go_to_detail{
	color: #999;
	border: 1px dashed #999;
	display: inline-block;
	padding: 15px;
	margin: 0 0 25px 0;
}


/* 2018.10.15追加
サムネイルを並べるスタイル */

.thum_list{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin: 0;
	padding: 0;
}

.thum_list li{
	margin: 0 25px 40px 0;
	border:2px solid #cdab18;
	position: relative;
	box-shadow:0px 3px 7px -2px #808080;
	padding: 2px;
}

.thum_list li img{
	vertical-align: bottom;
}

.thum_list li:after{
	font-family:"FontAwesome";
	color: #cdab18;
	background-color: rgba(255,255,255,0.8);
	border: 1px solid #cdab18;
	padding: 0 3px;
	font-size:22px;
	font-size:2.2rem;
	content:"\f00e";
	position:absolute;
	bottom:10px;
	right:10px;
}


/* 2020.06.05追加
ピックアプコンテンツを表示するスタイル */

.pickup_section{
	max-width: 1200px;
	margin: 0 auto 50px;
	padding: 50px 50px 10px;
	background-color: #eee5d0;
}

.pickup_section h2{
	margin: 0 0 1em;
}

.pickup_section h2 .caption{
	font-size: 24px;
	font-size: 2.4rem;
	display: block;
}

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

#pickup_syakyou{
	background-color:rgba(197,213,198,0.79);
}



/* 2020.06.05追加
ミニアート書作品並べるスタイル */

.art_gallery{
	display: flex;
	flex-wrap: wrap;
	/*justify-content: space-around;*/
	margin: 50px auto 25px;
}

.art_box{
	display: inline-block;
	margin: 0 15px 35px;
}

.art_box h3{
	text-align: center;
	font-size: 24px;
	font-size: 2.4rem;
	margin: 0 0 15px;
	border: 2px solid #d9c9a5;
	padding: 5px 10px;
	background-color: #eee5d0;
}

.art_photo{
	text-align: center;
}

.art_photo a{
	position: relative;
}

.art_photo a:after{
	font-family:"FontAwesome";
	color: #cdab18;
	background-color: rgba(255,255,255,0.8);
	border: 1px solid #cdab18;
	padding: 0 3px;
	font-size:22px;
	font-size:2.2rem;
	content:"\f00e";
	position:absolute;
	bottom:15px;
	right:15px;
}


.art_box table{
	width: 100%;
	font-size: 16px;
	font-size: 1.6rem;
	text-align: left;
	margin: 10px 0 10px;
	/*border-left: 5px solid #d9c9a5;
	border-right: 5px solid #d9c9a5;*/
	border-top: 1px solid #d9c9a5;
}

.art_box table th{
	font-weight: normal;
	padding: 8px 5px 8px 5px;
	border-bottom: 1px solid #d9c9a5;
}

.art_box table td{
	padding: 8px 5px 8px 5px;
	border-bottom: 1px solid #d9c9a5;
}



@media(max-width:1080px){
	
	.art_list .image_area img{
		max-width: 100%;
	}
	
	.thum_list li{
		margin: 0 15px 40px 0;
	}
	
}



@media (max-width:980px) {
	
	#art_catch .page_catch_text{
		color: #646464;
		position: relative;
		right: auto;
		left: auto;
		top: auto;
		background-color: rgba(255,255,255,0.7);
		padding: 25px 10px 10px;
	}

	
}


@media (max-width:850px) {
	
	.art_list{
		display: block;
		/*text-align:center;*/
		padding-bottom: 5px;
		margin-bottom: 50px;
	}
	
	.art_list:first-child{
		padding-top: 50px;
	}
	
	.art_list .image_area,
	.art_list:nth-child(even) .image_area{
		margin: 0 0 25px 0;
	}
	
	.art_list .image_area{
		text-align: center;
	}
	
	.art_list .text_area{
		max-width: 600px;
		margin: 0 auto 50px;
	}

	
	.art_list .text_area .simple_table{
		margin:  25px 0 50px;
	}
	
	.art_list section{
		text-align: left;
	}
	
	.art_list .text_area section .simple_table{
		margin-left: inherit;
		margin-right: inherit;
	}
	
}


@media (max-width:479px){
	
	.art_list .text_area h3{
		font-size: 22px;
		font-size: 2.2rem;
		
	}
	
	.art_list .text_area p {
		text-align: left;
	}
	
	.thum_list li img{
		max-width: 100%;
		height: auto;
	}
	
}


/*============================================================
3-6.	Examples Style
------------------------------------------------------------*/

.intro_section{
	border: 1px dashed #333;
	padding: 25px 25px;
}

.intro_section h3{
	position: relative;
	padding-bottom: 5px;
	margin: 0 0 50px;
}

.intro_section h3:after{
	width: 200px;
	height: 2px;
	background-color: #941c52;
	display: block;
	content: "";
	position: absolute;
	left: 50%;
	margin-left: -100px;
	bottom: -10px;
}

.intro_section p{
	text-align: left;
	max-width: 750px;
	margin: 0 auto 1em;
}

body#example .sub_section h3{
	background-color: #7b6920;
	color: #fff;
	margin-bottom: 50px;
}

dl.sentence_example{
	font-size: 16px;
	font-size: 1.6rem;
	margin: 0 25px 25px;
}

.sentence_example dt{
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
	margin:0;
	padding: 15px 15px;
	background-color: #f3edd3;
	border-bottom: 1px solid #c8b259;
}

.sentence_example dd{
	margin: 0 0 25px 0;
	padding: 15px 15px;
	background-color: #f3edd3;
}

.sentence_example dd p{
	margin: 0 0 1em;
}

ul.sentence_example{
	text-align: left;
	margin: 0 25px 25px;
}

ul.sentence_example li{
	display: block;
	padding: 15px 15px 15px 30px;
	background-color: #f3edd3;
	/*border-bottom: 1px solid #c8b259;*/
	position: relative;
	margin-bottom: 15px;
}

ul.sentence_example li:before{
	content: "";
	display: block;
	width: 5px;
	height: 5px;
	background-color: #7b6920;
	position: absolute;
	left: 10px;
	top: 50%;
	margin-top: -2px;
}


@media (max-width:768px){
	.intro_section{
		border: 1px dashed #333;
		padding: 25px 25px;
	}

	.intro_section h3{
		font-size: 22px;
		font-size: 2.2rem;
	}
}


@media (max-width:479px){
	
	.intro_section h3{
		font-size: 18px;
		font-size: 1.8rem;
	}
	
	body#example .sub_section h3{
		margin-bottom: 25px;
	}
	
	dl.sentence_example{
		margin: 0 0 25px;
	}
	
	.sentence_example dt{
		font-size: 16px;
		font-size: 1.6rem;
		font-weight: bold;
		margin:0;
		padding: 15px 15px;
	}
	
	ul.sentence_example{
		margin: 0 0 15px;
	}
	
}





/*============================================================
3-7.	Syakyou Style [2020.07.06追加]
------------------------------------------------------------*/

#syakyou_mv{
	margin-bottom: 50px;
}

#syakyou_catch .page_catch_text{
	position: absolute;
	left: 50px;
	top: 50px;
	color: #fff;
	background-color: rgba(23,33,25,0.80);
	padding: 50px 50px 35px;
}

.syakyou_susume{
	background-image:url("/syakyou/images/bg_syakyou_01.jpg");
	background-position: left bottom;
	background-repeat: no-repeat;
	border: 3px solid #fff;
	box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.2);
	padding: 15px;
	margin: 30px 0 30px;
}

.syakyou_susume h3{
	margin: 0 0 1em 0;
}

.syakyou_susume p{
	background-color: rgba(255,255,255,0.6);
	padding: 15px;
}

.expla_list{
	margin: 0 0 15px 0;
}

.expla_list dt{
	font-weight: bold;
	margin: 0 0 0 0;
	padding: 2px 0 0 1em;
	position: relative;
	border: 1px solid #ccc;
	border-bottom: none;
}

.expla_list dt:before{
	font-family:"FontAwesome";
	font-size:22px;
	font-size:2.2rem;
	color: #357700;
	content:"\f14b";
}

.expla_list dd{
	margin: 0 0 15px 0;
	padding: 0 0 2px 1em;
	border: 1px solid #ccc;
	border-top: none;
}

.expla_list .sample_list{
	margin: 10px 0 0;
}

.expla_list .sample_list li{
	margin: 0 0 10px;
}

.push_info{
	font-weight: bold;
	padding: 1em;
	background-color: rgba(255,204,204,0.72);
	margin: 0 0 1.5em 0;
}

.low_section{
	margin: 50px 0 50px;
}


.low_section h3{
	border-left: 5px solid #941c52;
	padding:0 0 0 0.3em;
}

.kakite_sample{
	margin: 0 0 50px 0;
	border-bottom: 2px dashed #ccc;
	padding-bottom: 10px;
}

.kakite_sample h4{
}

.sample_list{
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
}

.sample_list li{
	margin: 0 25px 40px 0;
	/*border:2px solid #cdab18;*/
	position: relative;
	box-shadow:0px 3px 7px -2px #808080;
	/*padding: 2px;*/
}

.sample_list li img{
	vertical-align: bottom;
}

.sample_list li:after{
	font-family:"FontAwesome";
	color: #cdab18;
	background-color: rgba(255,255,255,0.8);
	border: 1px solid #cdab18;
	padding: 0 3px;
	font-size:22px;
	font-size:2.2rem;
	content:"\f00e";
	position:absolute;
	bottom:10px;
	right:10px;
}

@media (max-width:980px) {
	
	#syakyou_catch .page_catch_text{
		color: #fff;
		position: relative;
		right: auto;
		left: auto;
		top: auto;
		background-color: rgba(28,41,31,0.80);
		padding: 25px 10px 10px;
	}

	
}




/*============================================================
3-8.	Temple Style 2024.07.28追加
------------------------------------------------------------*/

#temple_mv{
    margin-bottom: 30px;
}

#temple_section section p{
    margin: 0 15px 30px;
}

.profile_section{
    background-color: rgba(238,210,255,0.46);
    /*border-top: 2px solid #941c52;
    border-bottom: 2px solid #941c52;*/
    margin: 30px auto 30px;
    padding: 30px 15px 30px;
}

.profile_section h3{
    margin: 0 0 30px 0;
    background-color: rgba(255,255,255,0.8);
    padding: 0.5em 0.5em;
}

.profile_section p{
    margin: 0 15px 30px;
}

.profile{
    background-color: rgba(255,255,255,0.80);
    padding: 15px 15px 15px;
}

.profile h4{
    font-size: 18px;
    font-size: 1.8rem;
    margin: 0 0 15px;
    border-bottom: 1px dotted #941c52;
}

/* 
色々な事例を列挙する際に使用するスタイル */

.example_box{
    max-width: 550px;
    /*background-color: rgba(189,186,132,0.20);*/
    border: 2px solid #B3A887;
    padding: 10px 15px 10px;
    margin: 0 15px 30px;
    border-radius: 5px;
}

.example_box h4{
    font-size: 18px;
    font-size: 1.8rem;
    margin: 0 0 15px;
    border-left: 4px solid #941c52;
    border-bottom: 1px dotted #941c52;
    padding: 0 0 0 8px;
}

ul.circle_list{
    list-style-type: circle;
    margin: 0 0 15px 1em;
}

ul.circle_list li{
    margin-bottom: 0.5em;
}




@media (max-width:768px){
    body#temple .normal_section{
        padding-top: 0;
    }
    #temple_section{
    margin: 0 0 30px;
    }
    #temple_mv{
    margin-bottom: 30px;
    }
}


@media (max-width:479px){

}




/*============================================================
3-9.	tegaki-design Style 20250515追加
------------------------------------------------------------*/

.tegaki_catch_contents{
    background-image: none;
    background-color: rgba(97,58,106,0.76);
}


.tegaki_sample_section{
	background-image: url(../../images/contents/bg_sub_catch_01.jpg);
	background-repeat: repeat;
	background-position: left top;
    padding: 15px 0 15px;
}

.section_title{
    /*font-size: 28px;
    font-size: 2.8rem;*/
    padding: 0.8em 1em 0.8em 1em;
    border-top: 3px solid #fff;
    border-bottom: 3px solid #fff;
    margin: 0 0 30px;
}

.section_title .caption{
    font-size: 22px;
    font-size: 2.2rem;
    display: block;
}

.tegaki_sample_frame{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    padding-top: 30px;
    
}

.tegaki_sample{
    /*max-width: 350px;*/
    max-width: 260px;
    margin: 0 5px 45px;
    padding: 0;
}

.tegaki_sample img{
    max-width: 100%;
    height: auto;
    display: block;
    box-shadow:0px 3px 8px 3px rgba(0,0,0,0.1);
}

.tegaki_sample h3{
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: bold;
    display: inline-block;
    margin: 0 0;
    padding: 5px 0 0 10px;
}

.tegaki_sample p{
    font-size: 14px;
    margin: 0 0 0 10px;
}

.tegaki_sample_section .contact_box{
    background-color: rgba(255,255,255,0.59);
}

.concept{
    max-width: 840px;
    background-color: rgba(255,255,255,0.21);
    padding: 15px;
    margin: 30px auto 30px;
    border: 3px solid #fff;
}

.concept h2{
    border-bottom: 3px solid #fff;
    margin-top: 0;
    padding-left: 10px;
}

.concept p{
    padding: 0 10px 0 10px;
}


/* 2025.06.03追加 */

.pricing{
    padding: 25px;
}

.pricing h2{
    font-size: 24px;
    font-size: 2.4rem;
    border-left: 3px solid #752897;
    padding-left: 8px;
}

.pricing h3{
    font-size: 20px;
    font-size: 2.0rem;
}

.pricing_note{
    margin: 0 15px 30px;
    border-top: 2px solid #fff;
    border-bottom: 2px solid #fff;
    padding: 15px 0;
}

.pricing_note p{
    line-height: 1.5;
    margin-bottom: 0.5em;
}

.pricing_summary {
  list-style: disc;
  padding-left: 1.5em;
  margin-bottom: 1.5em;
}

.pricing_summary li{
    margin-bottom: 0.5em;
}

.pricing_table{
    background-color: rgba(255,255,255,0.3);
    margin: 0 15px 30px;
    border-top: 2px solid #752897;
    border-bottom: 2px solid #752897;
    padding: 15px 15px;
}

.pricing_items {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5em; /* 行間の余白 */
}

.pricing_items li{
  display: flex;
  align-items: flex-start;
  padding: 0.4em 0;
  border-bottom: 1px solid #999;
}

.price-label {
  width: 10em;
  padding-right: 1em;
  font-weight: bold;
  border-right: 1px solid #999;
}

.price-value {
  flex: 1; /* 右側は伸びる */
  color: #C70003;
  padding-left: 1em;
}

/* --- スマホ対応：幅768px以下では縦並びに --- */
@media screen and (max-width: 768px) {
  .pricing {
    padding: 15px;
  }

  .pricing_note {
    margin: 0 10px 20px;
    padding: 10px 0;
  }

  .pricing_summary {
    padding-left: 1em;
    margin: 0 10px 20px;
  }

  .pricing_table {
    margin: 0 10px 20px;
    padding: 10px;
  }

  .pricing_items li {
    flex-direction: column;
    align-items: flex-start;
  }

  .price-label {
    width: auto;
    border-right: none;
  }

  .price-value {
    flex: none;
  }
}




/*============================================================
3-10. Flow Style
------------------------------------------------------------*/

.flow_box{
	border: 2px solid #ccc;
	padding: 25px;
	margin: 0 25px 50px;
}

.flow_box h4{
	text-align: left;
	margin: 0 0 25px;
}

.case_list{
	font-size: 16px;
	font-size: 1.6rem;
	margin: 0;
	padding-top: 25px;
	border-top: 1px dashed #ccc;
}

.case_list dt{
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
	margin-bottom: 10px;
	text-decoration: underline;
}

.case_list dt span{
	color: #fff;
	padding: 3px 10px;
	display: inline-block;
	margin-right: 10px;
}

.case_list dt.ok span{
	background-color: #1a739d;
}

.case_list dt.ng span{
	background-color: #9d1a1a;
}

.case_list dd{
	margin: 0 0 25px 0;
	padding: 0 0 25px;
	border-bottom: 1px dashed #ccc;
}


@media (max-width:768px){
	
	.flow_box{
		margin: 0 15px 25px;
	}
	
	.case_list dt span{
		display: block;
		margin: 0 0 10px 0;
	}
	
}


@media (max-width:479px){
	
	.flow_box{
		padding: 15px;
	}
	
	.flow_box h4{
		font-size: 20px;
		font-size: 2.0rem;
	}
	
	.case_list dt{
		font-size: 16px;
		font-size: 1.6rem;
	}
	
}



/*============================================================
3-11. Profile Style
------------------------------------------------------------*/

.profile_photo{
	text-align: left;
	margin: 0 15px 15px;
	float: left;
}

.photo_section p{
	margin: 0 15px 1.5em 160px;
}

.photo_section:after{
	content: "";
	display: table;
	clear: both;
}

#profile_detail section h3{
	font-size: 20px;
	font-size: 2.0rem;
	text-align: left;
	background-color: transparent;
	border-left: 4px solid #941c52;
	border-bottom: 1px dashed #999;
	border-top: 1px dashed #999;
	margin: 0 15px 25px;
	padding: 5px 0 5px 10px;
}

#profile_detail section p{
	margin: 0 25px 2em;
}



@media (max-width:768px){
	
	.profile_photo{
		text-align: left;
		margin: 0 15px 15px;
		float:none;
	}

	.photo_section p{
		margin: 0 15px 1.5em 15px;
	}
	
	#profile .sub_section{
		border: none;
		margin: 0 0 50px;
	}
	
	#profile_detail section h3{
		font-size: 18px;
		font-size: 1.8rem;
		margin: 0 5px 15px;
	}
	
	#profile_detail section{
		margin-bottom: 50px;
	}
	
	#profile_detail section p{
		margin: 0 15px 1.5em;
	}
	
}




/*============================================================
3-12.	Staff Style
------------------------------------------------------------*/

.staff_section{
	border-color: #766000;
}

.staff_section h3{
	color: #fff;
	background-color: #766000;
}

.sub_section .staff_data{
	font-size: 16px;
	font-size: 1.6rem;
	margin: 0 25px 50px 25px;
	padding: 0;
	border: 1px solid #ccc;
}

.sub_section .staff_data dt{
	font-size: 22px;
	font-size: 2.2rem;
	font-weight: bold;
	/*color: #fff;
	background-color: #766000;*/
	background-color: #eee;
	margin: 0 0 15px;
	padding: 15px 15px 15px;
	border-bottom: 1px solid #ccc;
	position: relative;
}

.sub_section .staff_data dt.profile,
.sub_section .staff_data dt.achive{
	padding-left: 2.5em;
}

.sub_section .staff_data dt.profile:before{
	font-family:"FontAwesome";
	font-size:22px;
	font-size:2.2rem;
	content:"\f044";
	position:absolute;
	top:50%;
	margin-top: -0.4em;
	left:1em;
}

.sub_section .staff_data dt.achive:before{
	font-family:"FontAwesome";
	font-size:22px;
	font-size:2.2rem;
	content:"\f1fc";
	position:absolute;
	top:50%;
	margin-top: -0.4em;
	left:1em;
}



.sub_section .staff_data dd{
	margin: 0 0 15px 0;
	padding: 0 15px 15px;
	border-bottom: 1px dashed #ccc;
}

.sub_section .staff_data dd p{
	margin: 1.5em 0;
}

.sub_section .photo_list{
	text-align: center;
	font-size: 16px;
	font-size: 1.6rem;
	margin: 0 25px 0;
}

.sub_section .photo_list dt{
	font-size: 22px;
	font-size: 2.2rem;
	font-weight: bold;
	margin: 0 0 25px;
	padding: 0 0 5px;
	border-bottom: 1px dashed #ccc;
}

.sub_section .photo_list dd{
	margin: 0;
	padding: 0;
}

.sub_section .photo_list dd p{
	font-size: 14px;
	font-size: 1.4rem;
	margin: 0 0 1.5em;
	text-align: center;
}

.photo_list ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

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


/* 2021.09.25追記  */

.dash_box{
	color: #333;
	border: 2px dashed #ccc;
	margin: 15px 0;
	padding: 15px;
	background-color: rgba(211,211,211,0.26);
}
.dash_box h4{
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
	margin: 0 0 1em 0;
	padding: 0 0 0 10px;
	border-left: 5px solid #8D34B4;
	border-bottom: 1px dashed #8D34B4;
}



@media(max-width:479px){
	
	.sub_section .staff_data{
		margin: 0 0 25px;
		border-left: none;
		border-right: none;
	}
	
	.sub_section .staff_data dt,
	.sub_section .photo_list dt{
		font-size: 16px;
		font-size: 1.6rem;
	}
	
	.sub_section .staff_data dt.profile:before,
	.sub_section .staff_data dt.achive:before{
		left: 0.5em;
	}
	
}




/*============================================================
3-13.	Knowledge Style
------------------------------------------------------------*/


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

.column_section{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}

.article_box{
	width: 32%;
	margin: 0 2% 50px 0;
	padding: 25px 20px 25px;
	background-image:url(../../images/contents/bg_paper_brown.png);
	background-position: left top;
	background-repeat: repeat;
	border-radius: 10px;
}

.article_box:nth-child(3n){
	margin-right: 0;
}

.article_box header{
	border-bottom: 1px solid #fff;
	margin: 0 0 5px 0;
	padding: 0 0 8px;
}

.article_box header h3{
	font-size: 18px;
	font-size: 1.8rem;
	padding-left: 1.6em;
	position: relative;
	margin: 0;
}


.article_box header h3:before{
	font-family:"FontAwesome";
	font-size:22px;
	font-size:2.2rem;
	color: #357700;
	content:"\f14b";
	position:absolute;
	top:0.1em;
	left:0;
}


.article_box .article_contents p{
	margin: 0 0 1.5em;
}

.article_box .article_contents p.last_update{
	font-size: 12px;
	font-size: 1.2rem;
	margin: 0 0 10px;
	text-align: right;
}

.article_box .article_contents .go_to_detail{
	text-align: right;
	margin: 0 0 10px;
}

.article_box .article_contents .go_to_detail a{
	font-size: 16px;
	font-size: 1.6rem;
	padding-top: 0.4em;
	padding-bottom: 0.4em;
}


/* 記事本文で使用するスタイル */

#main_article{
	max-width: 1230px;
	margin: 0 auto;
	padding: 0 15px;
}

#main_article:after{
	content: "";
	display: table;
	clear: both;
}

.column_article{
	width: 67%;
	float: left;
	background-image:url(../../images/contents/bg_paper_brown.png);
	background-position: left top;
	background-repeat: repeat;
	padding: 25px;
	border-radius: 5px;
}

.column_article header{
	border-bottom: 1px solid #b9a78d;
	margin: 0 0 30px;
}

.column_article header .update_day{
	margin: 0 0 15px;
}

.column_article header h2{
	font-size: 30px;
	font-size: 3.0rem;
	margin: 0 0 30px;
	padding: 0 0 0 1.5em;
	position: relative;
}


.column_article header h2:before{
	font-family:"FontAwesome";
	font-size:30px;
	font-size:3.0rem;
	color: #357700;
	content:"\f14b";
	position:absolute;
	top:0.2em;
	left:0;
}


.column_article section{
	margin: 0 0 75px;
}

.column_article section h3{
	font-size: 22px;
	font-size: 2.2rem;
	margin: 0 0 25px 0;
	padding: 0 0 0 1.8em;
	position: relative;
}

.column_article section h3:before{
	font-family:"FontAwesome";
	font-size:22px;
	font-size:2.2rem;
	color: #357700;
	content:"\f2ae";
	position:absolute;
	top:0.2em;
	left:0;
}


.column_article section .article_image{
	max-width: 100%;
	height: auto;
}



.related_article{
	width: 29%;
	float: right;
	border: 1px solid #941c52;
	padding: 25px;
}

.related_article h3{
	font-size: 20px;
	font-size: 2.0rem;
	margin: 0 0 25px;
	border-bottom: 1px dashed #941c52;
	padding: 0 0 0.5em;
}

.related_article ul li{
	margin-bottom: 1em;
}



@media(max-width:900px){
	.article_box{
		width: 48%;
		margin-right: 4%;
	}
	
	.article_box:nth-child(3n){
		margin-right: inherit;
	}
	
	.article_box:nth-child(2n){
		margin-right: 0;
	}
	
	.column_article{
		width: 100%;
		float: none;
		margin-bottom: 50px;
	}
	
	.related_article{
		width: 100%;
		float: none;
	}
	
}


@media(max-width:768px){
	
	.column_article header h2{
		font-size: 26px;
	}
	
	.column_article header h2:before{
		font-size: 28px;
	}
	
	
}


@media(max-width:700px){
	
		.article_box{
		width: 100%;
		margin-right: 0;
	}
	
	.article_box:nth-child(3n){
		margin-right: inherit;
	}
	
	.article_box:nth-child(2n){
		margin-right: 0;
	}
	
}


@media (max-width:479px){
	
	.article_box .article_contents .go_to_detail a{
		font-size: 14px;
		font-size: 1.4rem;
	}
	
	#main_article{
		padding: 0;
	}
	
	.column_article section h3{
		font-size: 20px;
		font-size: 2.0rem;
		padding-left: 0;
		padding-bottom: 0.5em;
		border-bottom: 1px dashed #b9a78d;
	}
	
	.column_article section h3:before{
		display: none;
	}
	
	.related_article{
		border-right: none;
		border-left: none;
	}
	
}



/*============================================================
3-13.	Results Style
------------------------------------------------------------*/

section.record ol.number_count{
    font-size: 16px;
    font-size: 1.6rem;
}

section.record ol.number_count li{
    font-size: 18px;
    font-size: 1.8rem;
}

section.record_secton{
    background-color: #fff;
    padding: 15px 0 5px;
}

section.record_secton h3{
    border-top: 2px dotted#ccc;
    border-bottom: 2px dotted #ccc;
    padding: 10px 5px 10px;
}


section.record h3{
 background-color: #eee;
 padding: 3px 3px 3px;
}

.record_list{
    margin: 10px 10px 10px;
    text-align: left;
}

.record_list li{
    line-height: 1.8;
    margin: 0 0 15px;
    padding: 5px 5px 5px 8px;
    border-bottom: 1px dashed #ccc;
    border-left: 3px solid #801250;
}

.over-flow_box{
    max-width: 800px;
    height: 600px;
    overflow-y: scroll;
    margin: 0 auto 30px;
    border: 2px solid #ccc;
}

dl.record_entry{
    margin:  10px 10px 10px;
    text-align: left;
}

dl.record_entry dt{
    padding: 10px 0 5px 8px;
    margin: 0;
    border-left: 3px solid #801250;
}

dl.record_entry dd{
    border-bottom: 1px dashed #ccc;
    padding: 0 0 10px 8px;
    border-left: 3px solid #801250;
    margin: 0 0 15px 0;
}




/*============================================================
3-13.	News Style
------------------------------------------------------------*/

/************
基本のスタイルはよもやま話しから引き継ぎ
色やアイコンの変更
*************/

#news_section .article_box{
 background-color: #E4F3D9;
 background-image: none;
}


.article_box header h3:before{
	font-family:"FontAwesome";
	font-size:22px;
	font-size:2.2rem;
	color: #357700;
	content:"\f152";
	position:absolute;
	top:0.1em;
	left:0;
}




/*============================================================
3-14.	Contact Style
------------------------------------------------------------*/

body#contact .layout_center p{
	text-align: center;
}

.info_box{
	padding:30px;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	background-color: #eee;
	margin: 0 25px 0;
}

.info_box ul.tel_and_fax{
	font-size:28px;
	font-size:2.8rem;
}

.info_box ul.tel_and_fax em{
	font-size:34px;
	font-size:3.4rem;
	color:#f9461e;
}

.info_box ul.tel_and_fax li{
	margin:0 0 30px 0;
}

#contact_mail .info_box p{
	font-size:18px;
	font-size:1.8rem;
	margin: 0 0 1.5em;
}

.info_box div.contact_button{
	margin-bottom:0;
	margin:0 0 15px 0;
}



@media (max-width:479px){
	.info_box{
		padding: 15px 15px 5px;
		margin: 0 15px 0;
	}
	
	.info_box ul.tel_and_fax{
		font-size:18px;
		font-size:1.8rem;
	}
	.info_box ul.tel_and_fax em{
		font-size:22px;
		font-size:2.2rem;
	}
	#contact_mail .info_box p{
		font-size:16px;
		font-size:1.6rem;
	}
}



/*============================================================
3-15.	Form Style
------------------------------------------------------------*/


/* base */

div#mfp_hidden {
	overflow: hidden;
	width: 1px;
	height: 1px;
	padding: 0px;
	margin: 0px;
}
div#mfp_hidden input {
	margin: 10px;
}

form#mailformpro {
	padding: 10px 0px;
}

form#mailformpro dl{
	font-size: 100%;
}

form#mailformpro dl dt {
	clear: both;
	font-weight:bold;
	font-size: 16px;
	font-size: 1.6rem;
	padding: 15px 15px 5px 15px;
	border-top: solid 1px #CCC;
	margin: 0px;
	position:relative;
}

form#mailformpro dl dd{
	margin: 0px;
	padding: 10px 5px 10px 70px;
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 1.5em;
	text-align: left;
	margin: 0 0 20px 0;
}

form#mailformpro dl dd p{
	font-size: 14px;
	font-size: 1.4rem;
	margin: 0 0 0 0;
}


form#mailformpro dl dd ul,
form#mailformpro dl dd ol {
	font-size: 16px;
	font-size: 1.6rem;
	margin: 0px;
	padding: 0px;
}

form#mailformpro dl dd ul li,
form#mailformpro dl dd ol li {
	margin: 0px 0px 15px;
	padding: 0px;
	list-style: none;
}

.must,
.option{
	display:inline-block;
	background-color: #C00;
	padding: 4px 5px;
	font-size: 16px;
	font-size: 1.6rem;
	color: #FFF;
	margin: 0px 15px 0px 0px;
	border-radius: 4px;
	/*position:absolute;
	top:10px;
	left:15px;*/
}

.option{
	background-color:#3C49D5;
}


span.example{
	font-weight:normal;
	font-size:14px;
	font-size: 1.4rem;
	color:#999;
	margin:0px 0px 0px 1.5em;
	padding:0px 0px 0px 1.5em;
	border-left:1px solid #999;
}

/*span.radio{
	margin:10px 0px 0px;
	display:block;
}*/


div#mfp_phase_confirm div#mfp_phase_confirm_inner {
	font-size: 16px;
	font-size: 1.6rem;
}

div#mfp_phase_confirm div#mfp_phase_confirm_inner table th,
div#mfp_phase_confirm div#mfp_phase_confirm_inner table td{
	font-size: 16px;
	font-size: 1.6rem;
	padding: 8px 8px;
}

div#mfp_phase_confirm div#mfp_phase_confirm_inner table th{
	font-weight: normal;
	white-space: nowrap;
	text-align: left;
}

div#mfp_phase_confirm div#mfp_phase_confirm_inner div.mfp_buttons{
	text-align:center;
	margin-top: 30px;
}

div#mfp_phase_confirm div#mfp_phase_confirm_inner button{
	padding:8px 10px;
	margin:0 10px;
}


div#mfp_overlay {
	position: absolute;
	display: none;
	z-index: 10001;
}
div#mfp_overlay_inner {
	background-color: #FFF;
	padding: 15px;
	margin: 0px auto;
	border-radius: 5px;
	box-shadow: 0px 0px 10px #000;
	width: 640px;
	max-width: 90%;
}
div#mfp_overlay_background {
	background-color: #000;
	position: absolute;
	display: none;
	z-index: 10000;
}
div#mfp_loading_screen {
	z-index: 20000;
	opacity: 0.8;
	display: none;
	background-color: #000;
	position: absolute;
}
div#mfp_loading {
	z-index: 20001;
	position: absolute;
	display: none;
	width: 40px;
	height: 40px;
	background-image: url(_images/mfp_loading.gif);
}


/* input */

form#mailformpro input,
form#mailformpro textarea {
	padding: 3px;
	vertical-align: middle;
}
form#mailformpro select {
	vertical-align: middle;
	font-size: 14px;
	margin-bottom:10px;
}


form#mailformpro textarea.order{
	width:500px;
	height:200px;
	overflow:auto;
}


/* button */

div.send_buttons,
div#mfp_buttons{
	font-size: 18px;
	font-size: 1.8rem;
	clear: both;
	padding: 10px 0px;
	text-align: center;
}
div.send_buttons button#send_button_send {
}

div.send_buttons button#send_button_cancel {
}

div.send_buttons button,
div#mfp_buttons .mfp_element_button{
	font-size: 18px;
	font-size: 1.8rem;
	margin: 20px;
	padding: 8px 15px;
}

div.send_buttons button.imagebutton {
	margin: 0px;
	padding: 0px;
	border: none;
	outline: none;
	background: none;
}

div#mfp_buttons{
}



/* label */

form#mailformpro label {
	border-radius: 3px;
	margin: 3px 3px 10px;
	display: block;
}
form#mailformpro label:hover{
	cursor:pointer;
	background-color:#FFEAEA;
}
form#mailformpro label.mfp_checked {
	padding: 3px;
	border: solid 1px #CCC;
	background-color: #E8EEF9;
}
form#mailformpro label.mfp_not_checked {
	padding: 3px;
	border: solid 1px #EEE;
}

/* stripe */

.mfp_colored {
	background-color: #F6F7F9;
}
.mfp_achroma {
	background-color: #FFF;
}


@media(max-width:768px){
	body#form section.form_section h2 + p{
		display:none;
		margin:0;
	}
	form#mailformpro textarea.order{
		max-width:100%;
		overflow:auto;
	}
	form#mailformpro dl{
	}
	form#mailformpro dl dt{
	}
	/*form#mailformpro dl dt span.must,
	form#mailformpro dl dt span.option{
		display:block;
		position:relative;
		margin:0 0 5px 0;
		left: 0;
		top:0;
	}*/
	form#mailformpro dl dd {
		padding-left:20px;
	}
	form#mailformpro input,
	form#mailformpro textarea {
		max-width:100%;
	}
}

@media(max-width:479px){
	
	body#form .normal_section{
		background-color:transparent;
		padding: 0 0 0 0;
	}
	
	body#form .sub_section{
		border: none;
	}

	/*form#mailformpro dl dt span.must,
	form#mailformpro dl dt span.option{
		width:100%;
		display:block;
		position:relative;
		margin:0 0 5px 0;
		left:0;
		top:0;
	}*/
	
	span.example{
		display:none;
	}
	form#mailformpro dl dt{
		padding-left: 0;
	}
	form#mailformpro dl dd {
		padding-left:0;
	}
	form#mailformpro input,
	form#mailformpro textarea,
	form#mailformpro select{
		font-size: 16px;
		font-size: 1.6rem;
		max-width: 90%;
		display:block;
		margin-bottom:15px;
	}
	form#mailformpro label{
		border:1px solid #ccc;
		padding:3px 3px 3px 20px;
		position:relative;
	}
	form#mailformpro label input{
		display:inline-block;
		margin:0 5px 5px 0;
	}
	
	div#mfp_phase_confirm div#mfp_phase_confirm_inner table th,
	div#mfp_phase_confirm div#mfp_phase_confirm_inner table td{
		font-size: 14px;
		font-size: 1.4rem;
	}
	
}


/* お問い合わせ完了ページ */

.sub_section .points{
	text-align: left;
	margin: 0 25px;
}



/*============================================================
3-16.	Privacy Style
------------------------------------------------------------*/

#privacy_policy section{
	border-bottom: 1px solid #ccc;
	padding-top: 25px;
}

#privacy_policy section:first-child{
	border-top: 1px solid #ccc;
}

#privacy_policy h4{
	font-size: 18px;
	font-size: 1.8rem;
	border-bottom: 1px dashed #ccc;
	margin-bottom: 10px;
}

#privacy_policy p{
	font-size: 14px;
	font-size: 1.4rem;
	margin: 0 25px 15px;
}

#privacy_policy ul{
	font-size: 14px;
	font-size: 1.4rem;
	margin: 0 25px 15px;
	text-align: left;
}

#privacy_policy ul li{
	margin-bottom: 5px;
}


/*============================================================
3-17.	Sitemap Style
------------------------------------------------------------*/

nav.sitemap_links{
	text-align:left;
	margin:0 0 0 15px;
}


nav.sitemap_links a{
	text-decoration:none;
}

nav.sitemap_links ul{
	margin:0px auto;
}

nav.sitemap_links ul li ul{
	clear:both;
	margin:0 0 0 20px;
	padding:10px 0 0 10px;
	border-left:2px solid #fff;
}

nav.sitemap_links ul li ul ul{
	border-left:none;
	padding-left:0;
}

nav.sitemap_links ul li{
	margin-bottom:20px;
	display:block;
}

nav.sitemap_links ul li a{
	padding:0;
	position:relative;
}

nav.sitemap_links ul li a:before{
	font-family: "FontAwesome";
	font-size:14px;
	font-size:1.4rem;
	content:"\f105";
	position:absolute;
	left:-10px;
	left:-1rem;
	top:0;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}


@media (max-width:479px){
	nav.sitemap_links{
		text-align:left;
	}
	nav.sitemap_links ul{
		margin-left:15px;
	}
}


/* User style */

table.enter { margin:80px auto; width:400px; border:1px solid #0080c0; border-collapse:collapse; }
table.enter th { border:1px solid #0080c0; padding:1em; background:#0080c0; color:#fff; text-align:left; }
table.enter td { border:1px solid #0080c0; padding:1em; background:#fff; font-family:verdana,helvetica,arial; }
input.len { width:220px; margin-bottom:1em; }
div.btn { text-align:right; }
div.btn input { font-family:verdana,helvetica,arial; width:100px; height:32px; }
div.main { text-align:center; width:100%; }





/*============================================================
3-18.  FAQ Style  [scoped with .faq-page]
------------------------------------------------------------*/

/* セクション幅・ベース */
.faq-page .faq-section {
  max-width: 920px;
  margin: 2rem auto;
  padding: 0 1rem;
  color: #333; 
  line-height: 1.8;
}

/* 各Q&Aアイテム */
.faq-page details.faq-item {
  border: 1px solid #e7e7e7;
  border-radius: .6rem;
  background: #fff;
  margin: 1rem 0;
  overflow: clip;
  transition: box-shadow .2s ease;
}
.faq-page details.faq-item:hover {
  box-shadow: 0 2px 6px rgba(0,0,0,.04);
}

/* summary（質問） */
.faq-page details.faq-item > summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: .6rem;
  cursor: pointer;
  padding: 1rem 1rem 1rem 1.2rem;
  font-weight: 700;
  position: relative;
  user-select: none;
  min-height: 44px; /* モバイルのタップ配慮 */
}
.faq-page details.faq-item > summary:hover { background: #f9f9f9; }
.faq-page details.faq-item > summary::after {
  content: "▸";
  position: absolute;
  right: 1rem;
  color: #777;
  font-size: 1.2em;
  transition: transform .2s ease;
}
.faq-page details.faq-item[open] > summary::after {
  content: "▾";
  transform: rotate(180deg);
}

/* Qラベル（青） */
.faq-page .qa-label.qa-q {
  color: #0b5fff;
  background: #eaf1ff;
  border: 2px solid #bcd2ff;
  border-radius: 50%;
  width: 28px; height: 28px;
  display: inline-grid; place-items: center;
  font-size: 15px; font-weight: 800;
  margin-right: .6rem;
  flex-shrink: 0;
}

/* Aラベル（赤） */
.faq-page .qa-label.qa-a {
  color: #d92c2c;
  background: #ffecec;
  border: 2px solid #ffc9c9;
  border-radius: 50%;
  width: 28px; height: 28px;
  display: inline-grid; place-items: center;
  font-size: 15px; font-weight: 800;
  margin-right: .6rem;
  flex-shrink: 0;
}

/* 回答本文 */
.faq-page details.faq-item .answer {
  display: flex;
  align-items: flex-start;
  padding: .8rem 1.2rem 1.2rem 1.2rem;
}
.faq-page details.faq-item .answer p {
  margin: 0;
  flex: 1;
}

/* 開閉アニメ（控えめ） */
.faq-page details.faq-item[open] .answer {
  animation: faq-slide .2s ease-out;
}
@keyframes faq-slide {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ページ全体の基準 */
.faq-page {
  font-size: clamp(15px, 1.4vw, 17px);
  line-height: 1.8;
}

/* summary（質問部） */
.faq-page details.faq-item > summary {
  font-size: clamp(16px, 1.6vw, 19px);
  line-height: 1.6;
}

/* 回答本文 */
.faq-page details.faq-item .answer p {
  font-size: clamp(15px, 1.3vw, 17px);
  line-height: 1.9;
}

/* Q/Aラベル */
.faq-page .qa-label {
  font-size: clamp(13px, 1.2vw, 15px);
}







/*============================================================


					4. For Js Style


------------------------------------------------------------*/



/* For Light Box
*********************************/


/* Preload images */
body:after {
  content: url(/common/images/plug-in/close.png) url(/common/images/plug-in/loading.gif) url(/common/images/plug-in/prev.png) url(/common/images/plug-in/next.png);
  display: none;
}

.lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.8;
  display: none;
}

.lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-weight: normal;
}

.lightbox .lb-image {
  display: block;
  height: auto;
  max-width: inherit;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}

.lightbox a img {
  border: none;
}

.lb-outerContainer {
  position: relative;
  background-color: white;
  *zoom: 1;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}

.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-container {
  padding: 4px;
}

.lb-loader {
  position: absolute;
  top: 43%;
  left: 0;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}

.lb-cancel {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background: url(/common/images/plug-in/loading.gif) no-repeat;
}

.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

.lb-container > .nav {
  left: 0;
}

.lb-nav a {
  outline: none;
  background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
}

.lb-prev, .lb-next {
  height: 100%;
  cursor: pointer;
  display: block;
}

.lb-nav a.lb-prev {
  width: 34%;
  left: 0;
  float: left;
  background: url(/common/images/plug-in/prev.png) left 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-prev:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-nav a.lb-next {
  width: 64%;
  right: 0;
  float: right;
  background: url(/common/images/plug-in/next.png) right 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-next:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  *zoom: 1;
  width: 100%;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-data {
  padding: 0 4px;
  color: #ccc;
}

.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}

.lb-data .lb-caption {
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
}

.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 12px;
  color: #999999;
}

.lb-data .lb-close {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  background: url(/common/images/plug-in/close.png) top right no-repeat;
  text-align: right;
  outline: none;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
}

.lb-data .lb-close:hover {
  cursor: pointer;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}



/*============================================================


					5. For Plug-in


------------------------------------------------------------*/


/* For Mail Form
*********************************/

/* common */

div#mfp_hidden {
	overflow: hidden;
	width: 1px;
	height: 1px;
	padding: 0px;
	margin: 0px;
}
div#mfp_hidden input {
	margin: 10px;
}
div.mfp_thanks {
	padding: 30px;
}
div.mfp_thanks p {
	line-height: 1.7em;
}
div.mfp_thanks ul.mfp_caution {
	margin: 0px;
	padding: 0px;
}
div.mfp_thanks ul.mfp_caution li {
	display: block;
	color: #C00;
	margin: 0px;
	padding: 5px 0px;
}
div#mfp_thanks {
	text-align: center;
	font-size: 18px;
	padding: 20px 0px;
}
div#mfp_thanks strong {
	color: #C00;
	font-size: 24px;
}



/* confirm */

table#mfp_confirm_table {
	border-spacing: 0px;
	border-collapse: collapse;
	width: 100%;
}

table#mfp_confirm_table tr.mfp_colored {
	background-color: #F6F7F9;
}
table#mfp_confirm_table tr.mfp_achroma {
	background-color: #FFF;
}

table#mfp_confirm_table tr th,table#mfp_confirm_table tr td {
	text-align: left;
	font-size: 12px;
	border-top: solid 1px #CCC;
	padding: 5px 10px;
}
table#mfp_confirm_table tr th {
	white-space: nowrap;
	width: 200px;
}
table#mfp_confirm_table tr td {
	line-height: 1.5em;
	word-break: break-all;
}


/* confirm_flat */


div#mfp_phase_confirm {
	clear: both;
}
div#mfp_phase_confirm h4 {
	font-size: 36px;
	padding: 10px 0px 0px 0px;
	text-align: center;
}
div#mfp_phase_confirm div#mfp_phase_confirm_inner {
	
}


/* confirm_overlay */

div#mfp_overlay {
	position: absolute;
	display: none;
	z-index: 10001;
}
div#mfp_overlay_inner {
	background-color: #FFF;
	padding: 15px;
	margin: 0px auto;
	border-radius: 5px;
	box-shadow: 0px 0px 10px #000;
	width: 640px;
}
div#mfp_overlay_background {
	background-color: #000;
	position: absolute;
	display: none;
	z-index: 10000;
}


/* price */

div#mfp_price {
	color: #C00;
	font-size: 36px;
	padding: 10px;
	font-weight: bolder;
}
div#mfp_price span {
	color: #666;
	font-size: 12px;
	font-weight: normal;
}



/* error */

div.mfp_err {
	clear: both;
	display: none;
	text-align: left;
	margin: 5px 0px 0px 0px;
	padding: 3px 0px 5px 17px;
	color: #F00;
	font-size: 12px;
	line-height: normal;
	background-image: url(/common/images/plug-in/mfp_error.gif);
	background-repeat: no-repeat;
	background-position: 0px 1px;
}
.mfp_parent_error {
	border: solid 2px #F00;
}
.problem {
	background-color: #FCC;
}


div#mfp_error {
	background-color: #FEE;
	border: solid 1px #F00;
	padding: 10px;
	display: none;
}
div#mfp_error p {
	padding: 0px;
	margin: 0px;
	font-size: 14px;
	text-align: center;
}
div#mfp_error p strong {
	font-size: 18px;
	color: #F00;
}


/* warning */

div#mfp_warning {
	background-color: #FEE;
	border: solid 1px #F00;
	padding: 10px;
	display: none;
}
div#mfp_warning p {
	padding: 0px;
	margin: 0px;
	font-size: 14px;
	text-align: center;
}
div#mfp_warning p strong {
	font-size: 18px;
	color: #F00;
}



/* loading */

div#mfp_loading_screen {
	z-index: 20000;
	opacity: 0.8;
	display: none;
	background-color: #000;
	position: absolute;
}
div#mfp_loading {
	z-index: 20001;
	position: absolute;
	display: none;
	width: 40px;
	height: 40px;
	background-image: url(/common/images/plug-in/mfp_loading.gif);
}




/* phase */


button.mfp_next,button.mfp_prev {
	font-size: 18px;
	margin: 10px;
	padding: 5px 10px;
}
button.mfp_next {
	float: right;
}
button.mfp_prev {
	float: left;
}

ul#mfp_phase_stat {
	padding: 10px;
}
ul#mfp_phase_stat li {
	float: left;
	padding: 8px 15px;
	border-radius: 3px;
	margin: 5px;
	list-style: none;
	font-size: 14px;
}
ul#mfp_phase_stat li.mfp_phase_arrow {
	bos-shadow: none;
	padding: 8px 5px;
}
ul#mfp_phase_stat li.mfp_active_phase {
	background-color: #E8EEF9;
	box-shadow: 0px 0px 5px #000;
}
ul#mfp_phase_stat li.mfp_inactive_phase {
	background-color: #CCC;
	color: #666;
	box-shadow: 0px 0px 5px #CCC;
}