@charset "utf-8";
@import url(https://fonts.googleapis.com/icon?family=Material+Icons);
@import url(https://fonts.googleapis.com/icon?family=Material+Symbols+Outlined);



*,*:after,*:before {  box-sizing: border-box; }

a,  address,  article, aside,  b, blockquote, body, caption, dd, div, dl, dt, em, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hr, html, i, iframe, img, label, li, nav, object, ol, p, pre, section, small, span, strong, sub, sup, table, tbody, td, tfoot, th, thead, tr,  u, ul
{   border: 0;  margin: 0;  padding: 0; }

html,body{ height:100%;width: 100%;}

article, aside,section {   display: block; }

img {   color: transparent;  font-size: 0;  vertical-align: middle;  -ms-interpolation-mode: bicubic;}

br {  letter-spacing:normal; }
html {   overflow-y:scroll;	font-size: 16px;}

body {	font-family : verdana, sans-serif;	color: #454545;	line-height : 1.5}

a {   color:#134D99;   text-decoration:none;}

a:hover {   color:#134D99;   text-decoration:underline;}

h1,h2,h3,h4,h5,h6 { margin-bottom : 12px}

h3 {font-size: 16px; }

section, article {margin-bottom: 12px;}

.container  {   position: relative;  margin-left: auto;  margin-right: auto;  width: 960px;}

.clear {  clear: both;  display: block;  overflow: hidden;  visibility: hidden;  width: 0;  height: 0;}

.clearfix:before,
.clearfix:after,
.container:before,
.container:after {  content: '.';  display: block;  overflow: hidden;  visibility: hidden;  font-size: 0;  line-height: 0;  width: 0;  height: 0;}

.clearfix:after, .container:after {  clear: both;}

.clearfix,.container,  {  zoom: 1;}

/*box*/

header h1,
.header_navi,
.topi,
.main_l,
.main_r,
.top_column,
.footmenu
 {  margin-left: 10px;  margin-right: 10px;  display: inline;  float: left;}

/*角丸*/
.top_column,
.information h3,
.top_column,
.outline li a,
.banner li,
.submenu,
.submenu h3,
aside.container,
aside.banner,
aside.outbanner,
aside.banner img,
aside.outbanner img,
.catch_copy a,
.edi,
.engi,
.face,
.outlink,
.outlink img,
#pageTop {    border-radius: 4px;}

i {font-weight: normal;}

/* header */

header {padding-top:36px}

header h1 {  margin-top: -12px;  margin-bottom: -24px;  width: 340px;}
header h1 a {text-decoration: none;}

.jlogo {position: relative;top:-8px;left:8px}
.elogo {position: relative;top:-30px;left:108px;}


.header_navi {  width: 580px; }
.q_menu, .site_menu { text-align: right;}
.q_menu li, .site_menu li {   display: inline;margin-left: 10px;}

.q_menu {font-size: 12px;margin-bottom: 12px;}
.q_menu li {   font-size:12px;   overflow:hidden;   margin:0;   padding:0 0 0 15px;}
.q_menu li a {   color:#454545;   outline:none;}
.q_menu li a:hover {   color:#0080c0;   text-decoration:underline;}
.q_menu li a:before,.more a:before,.eqe a:before {
   content: "\0025b6";padding-right: 5px;   color:#0080c0;font-size: 0.9em;}
.q_menu li.enavi a:before {   content: "\0025b6";padding-right: 5px;   color:#ff8000;font-size: 0.9em;}

.site_menu {font-size: 14px;}
.site_menu li a {   font-weight:bold;   color:#454545;   outline:none;}
.site_menu li a:hover {   color:#454545;   border-bottom:3px solid #770000;   padding-bottom: 2px;   text-decoration:none;}
.site_menu li.mnavi i {padding-right: 2px;   color:#0080c0;}

/*google*/
#cse-search-box {display: inline;} 

/* cover image */
.topimg {
   position: relative;
   max-height: 480px;
   overflow: hidden;
   text-align: center;
   background-color: #efefef;
}
.topimg img.cover{
   max-width: 100%;
   min-width: 960px;
   min-height: 320px;
}


/*google icon に差し替え*/
.mnavi a:before, .edi h3 a:before, .outlink a:after, .banner .publication:before
{font-family: "Material Icons","Material Symbols Outlined";font-size: 1.1em;vertical-align: top;}
.mnavi a:before {content:'\e7fd';color:#006699;}
.edi h3 a:before {content:'\ea7d';}
.outlink a:after {content:'\e89e';margin-left:0.5em}
.banner .publication:before{content:'\e8cc';font-weight:thin;}

/*トップ画像上PR 20230725差替え*/
.topi {
width: 350px;
height: 260px;
position: absolute;
top: -280px;
left:-20px;
    border-radius: 2%;
    background: rgba(0,0,0,0.7);
    box-shadow:#b4b4b4 1px 1px 3px
}
.topi_in {margin:0.8em;text-align: center;}
.topi_in a {color:#fff;font-size:0.86em}

#top_movie {cursor : pointer;border:1px #666 solid;position: relative;}

#top_movie.point {position:relative;}
#top_movie.point:after{position:absolute;top:70px;left:130px;}
#top_movie.point:hover:after{content:url(../images/youtube_social_icon_white.png);}

.tv {margin-top: 1em;}
.topi iframe {margin: 0 auto;}


/*左右コンテナ*/
.main_l,
.main_r {
  font-size: 15px;
  margin-top: 1em;
}
.main_l {
  width: 620px;
}
.main_r{
  margin-bottom: 10px;
  width: 300px;
}

/*3列コラム*/


.top_column {
  position: relative;
  margin-bottom: 10px;
  margin-top: 30px;
  width: 300px;
height:250px;
   background-color: #fffbf8;
  border: 1px #ffcda1 solid;
}

.top_column h3 { 
   padding:5px 0 5px 2em; 
color:#454545;
    margin: 0.5em 0.5em 1em 0.5em;
font-weight: 600;
border-bottom:#f58735 2px dotted ;

}

.top_column h3:before{
  content:"";
  display:block;
  width:10px;
  height:10px;
  border:2px solid #f58735;
  position:absolute;
  top:20px;
  left:1em;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}


.top_column p,
.top_column ul {
   margin:0.5em 1em ;

   font-size: 14px;
}


.top_column li{ 
   margin-left: 1em;
   font-size: 13px;
   list-style-type: circle;
}


/*会長*/

.cbox {display: flex;flex-direction: column;}
.cinbox {display: flex;justify-content:space-between;}
.spc {margin-top: 0.5em;}
.chair {width:90px;text-align:center;}
/*2024*/
.bcard {width:270px;height:80px;line-height:80px;overflow:hidden;margin:0 auto;border-radius:5px}
.bcard img {width:100%;border:none}

/*2023
.cbox dl {margin:0 1em 0 1em;font-size: 0.86em;}
.cbox dt {font-weight: bold;text-indent: 1em;margin: 0;padding: 0;border-bottom: 3px #cccccc dotted;}
.cbox dd {margin: 0;padding: 0;}
.cbox dd li {list-style-type: none;}
.cbox dd a::before {font-family: FontAwesome;padding-right: 0.5em;}
.ytb a::before {font-size:1.2em;content: "\f16a";color:#FF0000;}
.film a::before { content: '\f008';}
*/



/*学会紹介*/
.outline {display: flex; display: -webkit-flex; flex-wrap : wrap;-webkit-flex-wrap : wrap;padding-top: 0.5em;}
.outline li {width:120px;list-style-type: none;margin-bottom:0.5em;text-align: center;
float: left\9;}
.outline li.j2020 {width:254px;}
.outline li.j2025 {width:254px;}
.outline li a {text-shadow:#005d8c 1px 1px 1p;display: block;border: #006db5 1px solid ;padding:0.1em;background-color: #ffffff;}
.outline li a:hover {position: relative;top: 1px;text-decoration: none;background-color: #d7ebff;}
.outline li.j2025 a::before {content:"JSCE2025";font-weight: bold;padding-right: 0.5em;}



/*バナーリンク*/
.banner li { 
  position: relative;
  list-style-type: none;
  display: inline;
  float: left;
  margin-bottom: 10px;
  height:60px;
  width: 300px;
  overflow: hidden;
}
.banner li span {
   font-size: 11px;
   position: relative;
   top:-28px;
   left:120px;
   letter-spacing: -0.5px;
}


.banner li a {
   display: block;
   font-size: 14px; 
   color: #454545;   
   text-shadow: 0 1px 1px #7f7f7f;
   background-repeat: no-repeat ;
   background-position:  5px;
   padding-left:120px;
   height: 58px;
   line-height: 50px;
  border: 1px #cccccc solid;
}

.main_l .banner li a {
   background-color: #f5f5f5;
}
.main_r .banner li a {
   background-color: #f7fbff;
}

.banner li a:hover {
   background-color: #ffffe1;
   color:#134D99;
   text-decoration: none;
}


.lef {
  margin-left: 0;
  margin-right: 10px;
}/*左*/
.rig {
  margin-left: 10px;
  margin-right: 0;
}/*右*/

.committees {background-image: url(../images/ico_com.jpg);}
.publication {background-image: url(../images/ico_pub.jpg);}
.jjournal {background-image: url(../images/ico_jj.jpg);}
.journal {background-image: url(../images/ico_journal.jpg);}
.cpd  {background-image: url(../images/ico_cpd.jpg);}
.branch {background-image: url(../images/ico_branch.jpg);}

.events {background-image: url(../images/ico_events.jpg);}
.library {background-image: url(../images/ico_lib.jpg);}
.day {background-image: url(../images/ico_day.jpg);}
.day2 {background-image: url(../images/ico_day.png);}

.prize {background-image: url(../images/ico_prize.jpg);}
.heritage {background-image: url(../images/ico_heritage.jpg);}
.dvd {background-image: url(../images/ico_dvd.jpg);}
.jscejp {background-image: url(../images/ico_jp.jpg);}


.zenkoku {background-image: url(../images/h26zenkoku.jpg);}
.edi_banner {background-image: url(../images/ico_edi.jpg);}
.banner li em {font-style: normal;font-size: larger;margin: 0 5px;}


.ico {background-image: url(../images/ico.jpg);}





/*PR*/

.prbanner {padding: 0 0.5em;display: flex; display: -webkit-flex; 
/*justify-content:space-between;-webkit-justify-content: space-between;*/
flex-wrap : wrap;-webkit-flex-wrap : wrap;
justify-content:space-between;-webkit-justify-content:space-between;
margin-top: 1em;}

.prbanner::after{
  content:"";
  display: block;
  width:300px;
}
/*PR枠が空欄１の場合左に詰める*/


.prbanner aside {width: 300px;text-align: center;height: 100px;border: 1px #cccccc solid;margin-bottom: 0.5em;}
.prbanner aside img {max-width: 100%;max-height: 100%;}

/*
.prbanner a {display: block;width: 100%;}
*/
.prbanner aside a:hover {  text-decoration: none; position: relative;top: 1px;}

.prbanner aside.tvlogo {border:none}

/*
.doboi {background-image: url(../images/doboiback.jpg);}
a.dobokui {font-size: 16px; color: #007400; text-shadow: 0 1px 1px #7f7f7f;}
a.dobokui span {color: #750000;}
.doboi p {font-size:9pt;background-color: #ffffff;height:50px;text-align: left;padding:4px}
.doboi p a::before {content:url(../images/shimatani_r2.jpg);float:left;margin-right:0.5em}
*/


/*Footer*/
footer {background-color: #5ea9da; 
margin-top: 24px;}

footer .container{
   background-color: #5ea9da;
   padding-top: 24px;
   padding-bottom: 24px;
   color: #ffffff;
   font-size: 13px;
}

footer a {color: #ffffff;}

.footmenu {  width: 220px; }
.footmenu h4 {margin-bottom: 0;}
.footmenu ul {margin-bottom: 1em;}
.footmenu li {margin-left: 1.5em;}

address {font-style: normal;}
.copy {text-align: left;padding: 24px 0 6px 0;}


/* INFORMATION */

.information {
   width:620px;
}

.information h3 {
   padding:0 10px;
   line-height:2.0;
   font-size:15px;
   font-weight:normal;
   margin:0 0 0.5em 0;
   color:#000;
   border:1px solid #ddd;
   background:#ccc;
   text-shadow: 0 1px 1px #7f7f7f;
}

.information h4{   
    margin-top: 0.5em;
    border-color:#cccccc;
    border-style: solid;
    border-width: 1px 1px 1px 8px;
    
    display:block;   
    padding:3px 0 3px 10px 
} 


.information dl {
   margin:0;
}
.information dt {
   float:left;
   padding-top:5px;
   margin-left: 5px;
   border-radius:3px;
}

.information dd {
   margin:0;
   padding:5px 0px 5px 9em;
   background-color:#ffffff
}


.topics dt {width:8.5em;text-align: center;font-size:11px;background-color: #ffc68c;}
.topics dt.zenkokunews {background-color: #e1ffe1;}
.topics dt.strategy {background-color: #0080c0;color:#ffffff}
.topics dt.pickup {background-color: #8080ff;color:#ffffff}

dl.maintenance dt {width:8.5em;text-align: center;
	background-color:#ff8040;color:#ffffff;font-size:11px;letter-spacing: -0.1px;
}


/*news tab*/
#tabs {
/*通常時*/

height: 410px;

/*総会バナー有

height: 490px;
*/
/*全国大会バナー有
height:550px;*/

}

ul.tab
{ 
  margin: 0 ;
  padding: 0;
  float: left;
  list-style: none;
  height: 32px;
  border-bottom: 1px solid #c4c4c4;
  border-left: 1px solid #c4c4c4;
  width: 100%;
}

.tab li{
  float: left;
  margin: 0;
  padding: 0;
  height: 31px;
  line-height: 31px;
  border: 1px solid #c4c4c4;
  border-left: none;  
  border-bottom: none;
  margin-bottom: -1px;
  position: relative;
   background:#eeeeee;
   font-size: 12px;
		text-shadow:#fff 1px 1px 2px

}
.tab li a{
  text-decoration: none;
  color: #000000;
  display: block;
  padding: 0 20px;
  border: 1px solid #ffffff;
  outline: none;

}
.tab li a:hover
{
  background: #cccccc;
}

.ui-tabs-active a{
    background-color:#ffffff;
    text-decoration:none;
    color:#333;
    cursor:default;
}
.panel{
  border: 1px solid #c4c4c4;
  border-top: none;
  clear: both;
  float: left;
  width: 100%;
/*通常時  */

  height: 380px;

/*総会バナー有 


  height: 460px; */
  
/*全国大会バナー有 

  height: 500px; */
 /*調整*/


overflow-y: auto;
  background: #ffffff;
}


.nbox {margin: 0.5em 0; font-size: 13px;}
.panel div:not(.news_topics) {margin:1em 0.5em}

/*右トピ*/
aside.banner a:hover {
    opacity: 0.85;
    filter: alpha(opacity=85);
    -moz-opacity: 0.85;
}

/*総会バナー*/


.rb_box{width:300px;
	border:1px solid #dddddd;border-radius:4px;
	
	background-color:#fff;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc4MTEiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iNDAuNjA4NjA3NzQ1NTYxNDQlIiB5MT0iMzQuMTg3MDUzNDMzNDI1MTM1JSIgeDI9IjEwMCUiIHkyPSIxMDAlIj4KPHN0b3Agc3RvcC1jb2xvcj0iI2ZmZmZmZiIgb2Zmc2V0PSIwIi8+PHN0b3Agc3RvcC1jb2xvcj0iI2JiZGRmZiIgb2Zmc2V0PSIxIi8+CjwvbGluZWFyR3JhZGllbnQ+CjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzgxMSkiIC8+Cjwvc3ZnPg==);
	padding:1em;text-align: center;
}
	.soukai {
		position: relative;
		color: #fff;
		display: inline-block;
		padding: 5px;
		overflow: hidden;
	} 
	
.ribon {
  position: absolute;
  top: 0;
  right: 0;
  width: 85px;
  height: 85px;
  overflow: hidden;
  }

.ribon span {
  display: inline-block;
  position: absolute;
  padding: 5px 0;
  left: -24px;
  top: 20px;
  width: 160px;
  text-align: center;
  font-size: 13px;
  line-height: 13px;
  background: #ff0000;
  color: #fff;
  letter-spacing: 0.05em;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  box-shadow: 0 0 0 2px rgb(227, 0, 0);
  
  border-top: dashed 1px rgba(255, 255, 255, 0.65);
  border-bottom: dashed 1px rgba(255, 255, 255, 0.65);
}



/*論説*/

.edi {border: 1px #eee solid;margin-top: 1em;
min-height: 160px;max-height: 160px;overflow: hidden;
background-image: url(../images/edi_back.jpg);}
.edi i,
.engi i {font-size: 15px;margin-right:5px ;}
.edi h3,
.engi h3
 {font-size: 13px;padding:5px 8px 0 8px;margin: 0.5em 0;letter-spacing: 0.1em;color: #006699;
 
}
#feed_editorial,
#feed_engi 
	 {margin:5px 10px;}
/*
#feed_editorial li,
#feed_engi li
	{ 
	overflow:hidden;font-size:9pt;width:260px;
	text-overflow: ellipsis;
	-webkit-text-overflow: ellipsis; 
	-o-text-overflow: ellipsis; 
	white-space: nowrap;
}
*/
#feed_editorial li {list-style-type: none;font-size: 0.8em;margin: 0.5em;}
#feed_editorial li a:before,
#feed_engi li a:before
 {
	content:"\002666";padding-right: 5px;font-size: 0.9em;
}



/*facebook*/
.face {
   width:300px;
/*通常時*/

   height:600px;
   
 /*総会、全国大会バナーサイズに合わせて適宜書き換え**indexの数値も修正*/

 /*   height:440px; 
  height: 520px; */

    padding:5px ;
	background-color: #ffffff;
	border:#aed5e8 1px solid ;
overflow: hidden;}

/*新刊*/
#feed_publication {display: flex;flex-wrap:wrap;}
#feed_publication .post {width:154px;margin-right:10px;padding:8px;box-shadow:#c0c0c0 1px 1px 6px;font-size:0.9em}
#feed_publication .post img {margin:5px}
.pub_thumnail {text-align:center}


/* 外部リンク*/
aside.outbanner {text-align: center;	background-color: #e6fff2;
	border:#aed5e8 1px solid ;
	padding: 0.5em;
}
aside.outbanner h3{font-size: 0.8em;font-weight: normal;}
aside.outbanner  a {font-size: x-small;}

/* footer外部リンク*/

.outlink {border:1px #9bc9e8 solid;min-height:21em}
.outlink h4 {margin-bottom: 1em;}
.outlink p {margin: 1.2em 0.8em;border-bottom:1px #9bc9e8  dotted;}
.outlink span {font-size: x-small;}


/* footer SNSアイコン */
#sns ul {margin-left: -1.8em;display: flex;}
#sns li {list-style-type:none;width: 2em;text-align: center;}
#sns li a {text-decoration:none;display:block;font-size:0.96em}
#sns li a:hover {position:relative;top:1px;}
/*#sns .tw a::before {content:url(../images/slogo_Twitter.png);position:relative;top:6px;}*/
*#sns .tw a::before {content:url(../images/slogo_X.png);position:relative;top:6px;}
#sns .fb a::before {content:url(../images/slogo_fb.png);position:relative;top:6px;}
#sns .nt {padding-top: 1em;}


/* --------PAGRTOP--------= */
#pageTop {
   position:fixed;
   right:0;
   bottom:0;
   padding:10px;
   background:#589fcb
}

#pageTop a {
   padding:0 0 0 12px;
   color:#fff;
   font-size:11px;
}