@charset "utf-8";
/* ===========================================================
 * 
 * 日本木彫刻協会　スタイルシート
 * Last UpDate : 2022/09/13 *
=========================================================== */

/* ----------------------------------------------------------
	style.css

	index
	 1 - ページ共通css
	 2 - リンクの色
	 3 - 見出し
	 4 - 背景
	 5 - レイアウト
	 6 - ヘッダー
	 7 - フッター
	 8 - グローバルナビゲーションlnavi
	 9 - ローカルナビゲーションlNavi
	10 - コンテンツ

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




/* ----------------------------------------------------------
 1 - ページ共通css
---------------------------------------------------------- */

@import "general.css";

body{
	color:#333;
	background-color:#f5f5f5;
}

.clear { clear:both; }

/* ページトップへ */
.pagetop{
	text-align:right;
	margin:5px;
	font-size:0.8em;
	min-height:9px;
}

.pagetop a:link, .pagetop a:visited{
	text-decoration:none;
}

.red{ color:#F00; }
.blue{ color:#00F; }
.b{ font-weight:bold;}

.fl{ float:left; }
.fr{ float:right; }


/* 平方メートル用 */
span.sup {
	font-size:80%;
	vertical-align:super;
}


/* 角丸 */
.kadomaru{
	-webkit-border-radius: 10px;	/* Safari,Google Chrome用 */
	-moz-border-radius: 10px;	/* Firefox用 */
	border-radius: 10px;		/* CSS3草案 */
	behavior: url(/css/PIE.htc); /* IEでもcss3を読めるようにする */
}

.txt{ line-height:1.5em; }
	
.small{	font-size:0.8em; }
.large12{ font-size:1.2em; }
.large13{ font-size:1.3em; }
.large14{ font-size:1.4em; }
.large15{ font-size:1.5em; }

.min{
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}

/* ----------------------------------------------------------
 2 - リンクの色
---------------------------------------------------------- */

a:link { color:#007ce4; text-decoration:underline; }
a:visited { color:#007ce4; text-decoration:underline; }
a:hover { color:#007ce4; text-decoration:none; font-weight:bold; }
a:active { color:#007ce4; text-decoration:underline; }


/* ----------------------------------------------------------
 3 - 見出し
---------------------------------------------------------- */

h1	{ font-size:1em; font-weight:normal; padding:5px; height:20px; color:#fff; }

h3 { background:url(../images/h3.png) no-repeat; height:28px; padding:9px 0 10px 15px; margin:10px 0; font-size:1.1em; }
h4 { border-left:10px double #f60; padding:3px 0 3px 10px; margin:10px 0; font-size:1.1em; }
h5 { background:url(../images/h5.png) no-repeat; padding:0 0 0 25px; margin:10px 0 5px 20px; font-size:1.1em; }

/* ----------------------------------------------------------
 4 - 背景
---------------------------------------------------------- */


/* ----------------------------------------------------------
 5 - レイアウト
---------------------------------------------------------- */

#wrapperTop{
	background:url(../images/bg_top.png) repeat-x;
}

#wrapperSecond{
	background:url(../images/bg.png) repeat-x;
}


#wrapper{
	width:960px;
	height:auto;
	margin-left:auto;
	margin-right:auto;
}



/* ----------------------------------------------------------
 6 - ヘッダー
---------------------------------------------------------- */

#header{
	width:960px;
	height:60px;
	background:url(../images/header.png) no-repeat left top;
}


/* ----------------------------------------------------------
 7 - フッター
---------------------------------------------------------- */

#footer{
	width:720px;
	margin:0 auto 0 auto;
}

#footer .footerSec{
}

#footer .footerSecTit{
	font-weight:bold;
	margin-bottom:5px;
	font-size:0.9em;
}

#footer .footerSec01{
	float:left;
	width:150px;
	height:200px;
	border-right:1px solid #ccc;
	padding:10px;
	margin:10px 0 10px 10px;
}

#footer .footerSec01 ul、#footer .footerSec02 ul{
	margin-left:1em;
}

#footer .footerSec01 li,#footer .footerSec02 li{
	line-height:2em;
	font-size:0.9em;
}


#footer .footerSec02{
	float:left;
	width:150px;
	height:200px;
	border-right:1px solid #ccc;
	padding:10px;
	margin:10px;
}

#footer .footerSec03{
	float:left;
	width:100px;
	padding:10px 10px 10px 0;
	margin:10px;
	font-size:0.9em;
	line-height:2em;
}


.copyright{
	border-top:1px solid #ccc;
	font-size:0.8em;
	color:#666;
	text-align:right;
	padding:5px;
}


/* ----------------------------------------------------------
 8 - グローバルナビゲーションgNavi
---------------------------------------------------------- */

/* nav */
#gNavi {
	overflow:hidden;
}


/* ドロップダウン */
.dropdown {float:left; height:40px;}
.dropdown dt {width:239px; border-right:1px solid #666; padding:10px 0; font-weight:bold; cursor:pointer; color:#fff; text-align:center;}
.dropdown dt:hover { background-color:#7a5bb5; }
.dropdown dd {width:239px;position:absolute; overflow:hidden; display:none; background:#fff; z-index:200; opacity:0;}
.dropdown ul {width:239px; border-bottom:1px solid #666; list-style:none; border-top:none;}
.dropdown li {display:inline; color:#fff; height:40px;}
.dropdown a, .dropdown a:active, .dropdown a:visited {width:239px; display:block; padding:10px; color:#fff; text-decoration:none; background:#333;}
.dropdown a:hover {background:#7a5bb5; color:#fff;}
.dropdown .underline {border-bottom:1px solid #666;}


/* ----------------------------------------------------------
 9 - ローカルナビゲーションlNavi
---------------------------------------------------------- */

#lNavi {
	float:left;
	width:240px;
	background-color:#ccc;
}



/* 日本木彫刻協会について */

#lNavi01{
	padding-bottom:0px;
}

.lNavi01Tit{
	padding:10px 5px 5px 10px;
	font-size:14px;
	font-weight:bold;
	border-bottom:1px dotted #666;
	margin-bottom:5px;
	background:#ccc;
}



#lNavi .lNaviBtn{
	margin-top:10px;
	margin-left:14px;
}


#lNavi .lNaviMovie{
	margin-top:30px;
	margin-left:14px;
}
#lNavi .lNaviMovieTit{
	margin-bottom:5px;
}
#lNavi .lNaviMovieThumb{
}


#lNavi{
	background:#ccc;
}
#lNavi ul{
}
#lNavi ul li{
	margin:0;
	padding:0;
	width:240px;
}
#lNavi ul li a{
	display:block;
	padding:8px 10px 8px 25px;
	color:#fff;
	background:url(../images/ico_arrow01.png) no-repeat 10px 12px #52466a;
	margin:0 10px 2px 10px;
	border-radius:10px;
}
#lNavi ul li a:hover{
	color:#fff;
	background:url(../images/ico_arrow01.png) no-repeat 10px 12px #9a4a35;
}
#lNavi ul li a{
	text-decoration:none;
	font-weight:normal;
}

#lNaviTop {
	padding:10px 0 5px 0;
}


/* ----------------------------------------------------------
 10 - コンテンツ
---------------------------------------------------------- */

/* ぱんくず */
.pankuzu{
	padding:8px 0;
	color:#666;
	font-size:0.8em;
}

/************** トップページ **************/

.topImg{
	width:960px;
	height:200px;
}


#contents{
	width:960px;
	margin:0;
	overflow:hidden;
}

#main{
	float:right;
	width:719px;
	padding-top:10px;
	border-right:1px solid #ccc;
	/* overflow:hidden; */
}

.pl20{
	padding-left:20px;
}

#main .pankuzu{
	padding:10px;
}


#main .topSec{
	width:680px;
}

#main .topSec01{
	overflow:hidden;
	margin-bottom:40px;
}
#main .topSec01:after{
	content:"";
	display:block;
	clear:both;
}

#main .topSec01Txt{
	float:left;
	width:360px;
	margin-right:20px;
}

#main .topSec01Txt01 {
	font-weight: bold;
	line-height: 2.2em;
	padding: 20px 0;
	margin: 25px 0;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}

#main .topSec01Movie{
	float:left;
	width:300px;
}
#main .topSec02Txt{
	width: 680px;
	margin-top: 10px;
}
#main .topSec01Img {
	float: left;
	width: 300px;
}


#main .topSec01Btn{
	float: right;
	margin-top: 20px;
}

#main .topSec01Btn a{
	width: 350px;
    display: block;
    font-size: 28px;
    padding: 16px;
    text-align: center;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    background-color: #a76aa1;
}

#main .topSec01Btn a:hover{
	opacity: 0.6;
}


/* 3つ並び用 */
#main .topSec3{
	float:left;
	width:200px;
	margin-right:30px;
}

#main .topSec3END{
	float:left;
	width:200px;
}

#main .topSec3Img{
	margin:5px 0;
}

#main .topSec3Txt{
	height:150px;
}

#main .topSec3Btn{
}

/* トップページ新着情報 */

#main .topNews{
	margin-bottom:40px;
}

#main .topNewsSec{
	overflow:hidden;
	border-bottom:1px dotted #000;
	margin:10px 20px 10px 10px;
}

#main .topNewsSecIcon{
	float:left;
	padding:5px 5px 5px 10px;
}

#main .topNewsSecDate{
	float:left;
	font-weight:bold;
	padding:5px;
	font-size:0.9em;
}

#main .topNewsSecTxt{
	float:left;
	padding:5px;
	font-size:0.9em;
}

.pageTop{
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	text-align:right;
}

/*** イベント情報 ***/
#main .event01Bnr01 a:hover {
	opacity:0.6;
	filter: alpha(opacity=60);
	-ms-filter: "alpha( opacity=60 )";
    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
}


#main .topSec ul{
	overflow:hidden;
	margin-top:10px;
}
#main .topSec ul li{
	float:left;
	width:330px;
	margin-right:20px;
	margin-bottom:20px;
}

#main .topSec ul li img{
	margin-bottom: 5px;
}

#main .topSec ul li:nth-child(2n){
	margin-right:0;
}

#main .topSec ul:after{
	content:"";
	display:block;
	clear:both;
}


/************** ご挨拶 greeting **************/

.titSec{
}

.titSec01{
	float:left;
	width:240px;
}

.titSec02{
	float:left;
	width:720px;
}


.greetingSec{
	overflow:hidden;
}

.greetingSecImg{
	float:left;
	width:135px;
	margin:10px;
}

.greetingSecImg img{
	margin-bottom:10px;
}


.greetingSecTxt{
	float:left;
	width:500px;
	margin:10px;
}


/************** 名誉会員ご挨拶 honorary-member **************/
.hm_sec{}
.hm_sec_list{ display: flex; justify-content: space-between; flex-wrap: wrap; }
.hm_sec_item{ flex-basis: 48%; margin-bottom: 30px; }
.hm_sec_tit{ margin-bottom: 5px; }
.hm_sec_img{ }




.hmSec{
	overflow:hidden;
	margin-bottom: 20px;;
}

.hmSecImg{
	float:left;
	width:200px;
	margin:10px;
}

.hmSecTxt{
	float:left;
	width:450px;
}

.hmSecImg01{
	float:left;
	width:320px;
}

.hmSecTxt01{
	float:left;
	width:370px;
}

.hmSecImg02{
	float:left;
	width:320px;
}

.hmSecTxt02{
	float:left;
	width:370px;
}


/************** 日本木彫刻協会とは about **************/
#main .secImg{
	float:right;
	width:200px;
	margin:0 20px 10px 10px
}

#main .secTxt{
	float:left;
	width:430px;
	margin-right:10px;
}


/************** 組織概要・沿革 history **************/
#main .sec02Img{
	float:right;
	width:300px;
	margin:0 20px 10px 10px
}

#main .sec02Txt{
	float:left;
	width:330px;
	margin-right:10px;
}

#main .historySec01,#main .supportSec,#main .guideSec{
	min-height:1000px !important;
}

#main .historySec{
}

#main .historySec table{
}

#main .historySec table th{
	padding:5px;
	border-left:3px solid #f60;
	text-align:left;
	width:100px;
}


#main .historySec table td{
	padding:5px;
}


/************** 会員一覧 member **************/

#main .memberSec{
	overflow:hidden;
}

#main .memberSec table{
}

#main .memberSec tr{
}

#main .memberSec th{
	background-color:#5d5175;
	padding:10px;
	color:#fff;
}

#main .memberSec th.kubun{
	width:100px;
}

#main .memberSec th.name{
	width:350px;
}

#main .memberSec th.katagaki{
	width:150px;
}




#main .memberSec td{
	background-color:#d7d4db;
	padding:10px;
}


/************** 会員の活動案内 works **************/

#main .worksSec{
	height:1000px !important;
}

#main .worksSec01{
	width:320px;
	float:left;
	margin:10px;
}

#main .worksSec01Img{
	float:left;
	width:145px;
	height:100px;
}

#main .worksSec01Txt{
	float:left;
	margin-left:10px;
}

#main .worksSec01Name{
	font-weight:bold;
	margin-bottom:5px;
}

#main .worksSec01URL{
	font-size:0.9em;
}

#main .worksSec01Tit{
	font-weight:bold;
	margin-top:5px;
}


/************** よくある質問 faq **************/


#main .faqSec01{
	margin-top:20px;
	background-color:#fff;
	padding:20px;
}

#main .faqList ul{
	padding-top:10px;
	padding-bottom:10px;
	margin-top:20px;
}

#main .faqList li.q{
	width:670px;
	background-image:url(../faq/images/q.png);
	background-repeat:no-repeat;
	min-height:60px;
	padding-left:55px;
	padding-top:25px;
	font-weight:bold;
}

#main .faqList li.a{
	background-image:url(../faq/images/a.png);
	background-repeat:no-repeat;
	min-height:60px;
	padding-left:55px;
	line-height:1.5em;
}

#main .faqList li ol{
	margin-left:30px;
	list-style:decimal;
}

#main .faqList li ul{
	margin-left:30px;
	list-style:disc;
}



/************** リンク link **************/

#main .linkSec{
	overflow:hidden;
}

#main .linkSec table{
}

#main .linkSec tr{
}

#main .linkSec th{
	background-color:#5d5175;
	padding:10px;
	color:#fff;
}

#main .linkSec th.kubun{
	width:100px;
}

#main .linkSec th.name{
	width:150px;
}

#main .linkSec th.url{
	width:350px;
}


#main .linkSec td{
	background-color:#d7d4db;
	padding:10px;
}

#main .linkSec td a:hover{
	font-weight:normal !important;
	color:#991c11;
}



/************** お問い合わせ contact **************/

#main .contactSec{
	margin-top:20px;
	padding:20px;
}

#main .contactSec table{
	width:640px;
	border-top:1px dashed #999;
	background-color:#fff;
}

#main .contactSec table th{
	background-color:#f0f0f0;
	padding-right:20px;
	padding-left:10px;
	line-height:1.5em;
	border-bottom:1px dashed #999;
	text-align:left;
	width:150px;
}

#main .contactSec table td{
	line-height:1.5em;
	border-bottom:1px dashed #999;
}

#main .contactSec table td.tit{
	width:40px;
	background-color:#f0f0f0;
	border-right:1px dashed #999;
}

#main #mailform{
	background-color:#fff;
}

#main .privacySec{
	margin-left:20px;
	margin-right:20px;
	line-height:1.5em;
}

#main .mailform{
	padding:0;
}

#main .contactSecTxt{
	margin-top:20px;
	padding-left:20px;
	padding-right:20px;
}

/************** お知らせ news **************/

#main .newsSec{
	height:215px;
	width:680px;
	font-size:1.1em;
}

#main .newsSec01{
	float:left;
	width:200px;
	height:215px;
	margin-left:20px;
	font-size:0.8em;
}

#main .newsSecImg01{
	margin-bottom:10px;
}

#main .newsSecWrap{
	overflow:hidden;
	width:680px;
	margin-top:10px;
	margin-bottom:30px;
	margin-right:-10px;
}
#main .newsSec02{
	float:left;
	width:160px;
	margin-right:10px;
	margin-bottom:20px;
}
#main .newsSec02Img{
}
#main .newsSec02Txt{
	font-size:0.8em;
}

#main .newsSec03{
    
}

#main .newsSec03 ul{
    
}

#main .newsSec03 ul li{
    float:left;
    width: 217px;
    height: 160px;
    margin: 0 14.5px 14px 0;
    
/*    width:32%;    */
/*    margin-right: 1%;   */
}

#main .newsSec03 ul li:nth-child(3n){
    margin-right: 0;
}


#main .newsSec04{
    
}

#main .newsSec04 ul{
    
}

#main .newsSec04 ul li{
    float:left;
    width: 160px;
    height: 350px;
    margin:0 13.33px 14px 0;
  /*  width:24%;
    margin-right: 0.66%;
  */
}

#main .newsSec04 ul li:nth-child(4n){
    margin-right: 0;
}

#main .newsSec03 ul:after,
#main .newsSec04 ul:after{
	content:"";
	display:block;
	clear:both;    
}

#main .dai4kai .newsSec03 ul li{width: 217px; height: 145px;}
#main .dai4kai .newsSec04 ul li{width: 160px; height: 280px;}

/************** ボランティア活動 son **************/
#main .sonSec {
	width:640px;
	padding:0 20px;
}

#main .sonSec table{
	width:640px;
	border-spacing:0;
	border-top:1px solid #999;
	border-left:1px solid #999;
}

#main .sonSec table th{
	background-color:#ddd;
	font-weight:normal;
	vertical-align:middle;
	padding:10px;
	width:30%;
	border-bottom:1px solid #999;
	border-right:1px solid #999;
}

#main .sonSec table td{
	text-align:left;
	padding:10px 10px 10px 20px;
	border-bottom:1px solid #999;
	border-right:1px solid #999;
}


/************** サイトマップ sitemap **************/

#main .sitemapSec table td{
	padding:5px;
	border-left:3px solid #f60;
	text-align:left;
}


/************** 事業報告 report **************/

#main .reportSec {
	width:660px;
	padding-left:20px;
	margin-bottom:80px;
}
.h600{
	overflow:hidden;
	height:600px;
}

#main .reportSec table {
	width:640px;
	border-spacing:0;
	border-top:1px solid #999;
	border-left:1px solid #999;
}

#main .reportSec table th {
	background-color:#eaeaea;
	font-weight:normal;
	vertical-align:middle;
	text-align:left;
	padding:10px 10px 10px 20px;
	width:65%;
	border-bottom:1px solid #999;
	border-right:1px solid #999;
}

#main .reportSec table td {
	text-align:left;
	vertical-align:middle;
	padding:10px 10px 10px 20px;
	border-bottom:1px solid #999;
	border-right:1px solid #999;
}

#main .reportSec table td.dl {
	height:27px;
	padding-left:40px;
	background:url(../report/images/ico_pdf01.png) no-repeat 10px 10px;
}

/************** 展示会 > 開催概要 hold **************/

#main .holdSec{
	overflow:hidden;
}

#main .holdSec table{
}

#main .holdSec tr{
}

#main .holdSec th{
	width: 150px;
	background-color:#5d5175;
	padding:10px;
	color:#fff;
}


#main .holdSec td{
	width: 480px;
	background-color:#d7d4db;
	padding:10px;
}

/************** その他の活動 others **************/
#main .othersSec{
}
#main .othersSec:after{
	content:"";
	display:block;
	clear:both;
}
#main .othersSecTxt{
	float:left;
	width:430px;
	margin-right:20px;
	margin-left:20px;
}
#main .othersSecImg{
	float:left;
	width:200px;
}
#main .othersSecImg01{
	margin-bottom:10px;
}


/************** 過去の展覧会 past **************/
.pastSec{ width: 680px; }
.pastSec > ul{ display: flex; justify-content: space-between; flex-wrap: wrap; }
.pastSec > ul > li{ margin-bottom: 5px;  }
.pastSec > ul > li img{ width: 100%; height: auto; }

.pastSec > ul.ul03 > li{ flex-basis: 33%; }
.pastSec > ul.ul03:after{ content: ""; display: block; width: 33%; }
.pastSec > ul.ul04 > li{ flex-basis: 24%; }
.pastSec > ul.ul04:before{ content: ""; display: block; width: 24%; order: 1; }
.pastSec > ul.ul04:after{ content: ""; display: block; width: 24%; }