@charset "UTF-8";
html {
  overflow-y: scroll; }

article, aside, canvas, details, figcaption, figure, header, footer, hgroup, menu, nav, section, summary {
  display: block; }

body, div, dl, dt, dd, ul, ol, li, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0; }

address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal; }

img, abbr, acronym, fieldset, a img {
  border: none; }

q:before, q:after {
  content: ''; }

object, embed {
  vertical-align: top; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

a {
  outline: none;
  cursor: pointer; }

ul, ol {
  list-style-type: none; }

input[type=checkbox], input[type=radio], input[type=submit], button, select, label {
  cursor: pointer; }

h1, h2, h3, h4, h5, h6 {
  margin: 0; }

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

sub {
  bottom: 0.2em;
  position: relative;
  font-size: 0.65em; }

sup {
  top: 0.2em;
  position: relative;
  font-size: 0.65em; }

html {
  font-size: 62.5%;
  }

body {
  /*min-width: 1044px;*/
  width: 100%;
  height: 100%;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  color: #000000;
  font-size: 16px;
  font-size: 1.6rem;
  background-color: #ffffff;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0.2); }

a {
  color: #000000; }
  a:hover, a:focus {
    text-decoration: none;
    color: #148aa0; }
    a:hover img, a:focus img {
      opacity: 0.8;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
      transition: all .3s ease-in-out; }

hr {
  border-top: 1px solid #148aa0;
  margin-bottom: 50px; }

.clearFix:after{
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
	}
	
.cnt-center{
	text-align: center;
}

.cnt-right{
	text-align: right;
}

.cnt-left{
	text-align: left;
}



/*----IE7 ----*/
.clearFix{	
	display:inline-block;
	}

/*----IE6----*/

/*Hides from IE-mac\*/
*html.clearFix{	height:1%;}
.clearFix{ display:block;}
/*End hide from IE-mac*/

.sp_display{
	display: none;
}

.pc_display{
	display: block;
}

@media screen and (max-width:980px){
	.sp_display{
		display: block;
	}

	.pc_display{
		display: none;
	}
	

ul.accordion a span.nomalfont{
	font-weight: normal;
	    color: #F17A00;

}	
	
}


/* layout ***********************************************/

.container {
    width: 1000px;
    margin: 0 auto;
}

@media screen and (max-width:980px){

.container {
    width: 100%;
}
	
}

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

.nav-container{
	width: 850px;
    margin: 0 auto 20px;
}

@media screen and (max-width:980px){

.nav-container{
    width: 100%;
	}
	
}

.nav-container::after {
    content: "";
    display: table;
    clear: both;
}

.news-container{
	width: 846px;
    margin: 0 auto 20px;
}

@media screen and (max-width:980px){

.news-container{
    width: 100%;
	}
	
}

.news-container::after {
    content: "";
    display: table;
    clear: both;
}


.reform-index-container{
	width: 920px;
    margin: 0 auto 20px;
	position: relative;
}

@media screen and (max-width:980px){

.reform-index-container{
    width: 100%;
	}
	
}

.reform-index-container::after {
    content: "";
    display: table;
    clear: both;
}


.reform-dd-container{
	width: 920px;
    margin: 0 auto 20px;
	position: relative;
}

@media screen and (max-width:980px){

.reform-dd-container{
    width: 100%;
	}
	
}

.reform-dd-container::after {
    content: "";
    display: table;
    clear: both;
}


.event-container,
.campaign-container,
.anshin-container,
.bousui-container {
    width: 1000px;
    margin: 0 auto;
}

@media screen and (max-width:980px){

.event-container,
.campaign-container,
.anshin-container,
.bousui-container {
    width: 100%;
}
	
}

.event-container::after,
.campaign-container::after,
.anshin-container::after,
.bousui-container::after{
    content: "";
    display: table;
    clear: both;
}


.workshop-index-container{
	width: 880px;
    margin: 0 auto 20px;
	position: relative;
		background: #F5F5F5;
}

@media screen and (max-width:980px){

.workshop-index-container{
    width: 100%;
	}
	
}

.workshop-index-container::after {
    content: "";
    display: table;
    clear: both;
}


.workshopbox-index-container{
	width: 920px;
    margin: 0 auto 20px;
	position: relative;
}

@media screen and (max-width:980px){

.workshopbox-index-container{
    width: 100%;
	}
	
}

.workshopbox-index-container::after {
    content: "";
    display: table;
    clear: both;
}


.greeting-container,
.shop-container,
.policy-box,
.access-store-inner{
    width: 1000px;
    margin: 0 auto;
}

.breadcrumbs-container{
    width: 1000px;
    margin: 0 auto;
}

.breadcrumbs-workshop-container{
    width: 1000px;
    margin: 0 auto;
}	

.office-container{
    width: 100%;
    margin: 0 auto;
}

@media screen and (max-width:980px){

.greeting-container,
.shop-container,
.office-container,
.access-store,
.policy-box,
.access-store-inner,
.breadcrumbs-container,
.breadcrumbs-workshop-container{
    width: 100%;
	}
	
}

.greeting-container::after,
.shop-container::after,
.office-container::after,
.access-store::after {
    content: "";
    display: table;
    clear: both;
}




/* header ***********************************************/

.site-header{
	position: relative;
}

.site-header .site-logo {
    margin: 0;
    padding-top: 15px;
	height: 100px;	
    font-size:12px;
}

.site-header .site-header-links {
    position: absolute;
    right: 0;
    top: 5px;
	
}

	.site-header .site-header-links a{
		text-decoration: none;
	}
	
	.site-header .site-header-links ul li:first-child{
		position: absolute;
		top: 40px;
		left: -75px;
	}

	.site-header .site-header-links ul li {
		display: inline-block;
	}
	
	.site-header .site-header-links > ul > li {
		padding: 0 15px;
	}


/* workshop header ***********************************************/

.site-workshop-header{
	position: relative;
	margin-bottom:15px;
}

.site-workshop-header .site-logo {
    margin: 0;
	height: 90px;
}

.site-workshop-header .site-header-links {
    position: absolute;
    right: 0;
    top: 20px;
}

	.site-workshop-header .site-header-links ul li {
		display: inline-block;
	}
	
	.site-workshop-header .site-header-links > ul > li {
		padding: 0 15px;
	}


/* sp header ***********************************************/	
	
@media screen and (max-width:980px){
	
	.sp-head-inner {
		width: 100%;
		position: relative;
	}

	
	.sp-head-left{
		float: left;
		width: 70%;
		margin-top: 13px;
		margin-right: 3%;
	}
	
		.sp-head-left img{
			    width: 100%;
				height: auto;
			}

	.sp-head-right{
		top:0;
		right:0;
		/*width:40%;*/
		width:80px;
		float: right;
		text-align: right;
	}
	

	
		.sp-head-right img{
			    width: 100%;
				height: auto;
				vertical-align: bottom;
			}
			
			.empty_nav{
				color: #FFF;
				padding: 4%;
				text-align:center;
			}
}

.g-nav{
  display: none;
  position: absolute;
  /*background: #afa;*/
  left:0;
  width: 98%;
  margin-left: 1%;
  margin-right: 1%;
  
  background: #FFF;
}

nav.g-nav{
	z-index: 11;
}

.accordion .fas{
	margin-top: 5px;
	}

ul.accordion { background:#DDD; width:100%; margin:0 auto; font-size:16px; border: 1px solid #CCCCCC; }
ul.accordion a { display:block; padding:4%;  background-position:97% center; background-repeat:no-repeat; text-decoration:none; color:#F17A00; font-weight:bold; text-align:center;}
ul.accordion span { display:block; padding: 10px 10px 10px 20px; background-position:97% center; background-repeat:no-repeat; color:#333; font-weight:bold;}
ul.accordion ul { display:none;}
ul.accordion > li { background:#FFF; border-bottom: 1px solid #CCCCCC;}
ul.accordion > li:last-child { border-bottom: none;}
ul.accordion > li > p { background: #FFF; text-align:left;}
ul.accordion > li > p span { background-image: url(../../img/common/open.png);}
/*ul.accordion > li > p span.open { background-image:url(../img/close.png);}*/
ul.accordion > li > ul > li { background:#FECACF; border-bottom:1px solid #fff;}
ul.accordion > li > ul > li:last-child { border-bottom: none;}
ul.accordion > li > ul > li > p { background:#999;}
/*ul.accordion > li > ul > li > a { background:url(../img/go.png) no-repeat 98% center;}*/
ul.accordion > li > ul > li > ul > li { background:#FFF; border-bottom:1px dotted #888;}
ul.accordion > li > ul > li > ul > li:last-child { border:none;}


li.sp-head-info a{
	background: #F17A00;
}

li.sp-head-info a{
	color: #FFF;
}

li.sp-head-tel a{
	color: #000;
}
	

/* nav ***********************************************/


.site-gnav ul li {
    /*width: 16.66667%;*/

    float: left;
	text-align:center;
    box-sizing: border-box;
	margin-right: 30px;
}

.site-gnav ul li:last-child {
	margin-right: 0;
}

.site-gnav ul li a {
    font-size: 1.6rem;
	text-decoration: none;
}

/* footer ***********************************************/

.footer{
	background:url(../images/footer_bg.jpg) repeat left top;
	padding: 50px 0;
}

.footer-workshop{
	background:url(../images/footer_bg.jpg) repeat left top;
	padding: 10px 0 20px;
}

.footer-inner{
    display: flex;
    justify-content: space-between;
}

.footer-logo{
	margin-right: 75px;
	margin-top: 20px;
}

.footer-logo img{
	width: 426px;
	height: 50px;
}

.footer-workshop-inner{
    display: flex;
    justify-content: center;
}

.footer-workshop-inner .footer-logo{
	margin-right: 30px;
	margin-top: 0;
	margin-left: 60px;

}

.footer-workshop-inner .footer-logo img{
	width: 194px;
	height: 90px;
}

.footer-workshop-inner .footer-lead{
	margin-left: 0;
	margin-top: 35px;
}

.footer-icon{
	margin-right: 20px;
}
	
.footer-nav{
    display: flex;
    justify-content: space-around;
	background-color:#fff;
	padding-bottom:35px;
	padding-top:30px;
}

.footer-mail,
.footer-tel{
	/*margin: 5px;*/
	width:50%;
	text-align: center;
}

.footer-mail a,
.footer-tel a{
	display: block;
	/*color: #FFF;*/
	text-decoration: none;
    /*font-size: 2.2rem;
	padding: 10px;*/
	width:100%;
}

.footer-mail a:hover,
.footer-tel a:hover{
	/*background: #FFF;*/
	transition: all .3s ease-in-out;	
}


.mail-btn {
  display: block;
  /* アイコンのサイズをビューポート幅に応じて可変にする */
  width: 15vw; 
  height: 15vw; /* 正方形にするため幅と同じ値を指定 */
  max-width: 570px; /* PCなど画面が大きい場合の最大サイズを制限 */
  max-height: 79px;

  /* 結合したスプライト画像（通常時とホバー時の2枚）を背景に設定 */
  background-image: url(https://nagai-mmb.co.jp/wp201907/wp-content/uploads/2025/11/mail_btn.png);
  background-repeat: no-repeat;
  
  /* レスポンシブ対応の鍵：背景画像を親要素の幅100%、高さ200%で伸縮させる */
  background-size: 100% 200%; 
  
  /* 通常時は上半分 (0%) を表示 */
  background-position: 0 0; 
  transition: background-position 0.3s ease;
  
  text-align:center;
  margin:0 auto;
}

.tel-btn {
  display: block;
  /* アイコンのサイズをビューポート幅に応じて可変にする */
  width: 15vw; 
  height: 15vw; /* 正方形にするため幅と同じ値を指定 */
  max-width: 570px; /* PCなど画面が大きい場合の最大サイズを制限 */
  max-height: 79px;

  /* 結合したスプライト画像（通常時とホバー時の2枚）を背景に設定 */
  background-image: url(https://nagai-mmb.co.jp/wp201907/wp-content/uploads/2025/11/tel_btn.png);
  background-repeat: no-repeat;
  
  /* レスポンシブ対応の鍵：背景画像を親要素の幅100%、高さ200%で伸縮させる */
  background-size: 100% 200%; 
  
  /* 通常時は上半分 (0%) を表示 */
  background-position: 0 0; 
  transition: background-position 0.3s ease;
  
   text-align:center;
  margin:0 auto; 
}



/* ホバー時の切り替え */
.mail-btn:hover,
.tel-btn:hover {
  /* 下半分を表示（100%分上にずらす） */
  background-position: 0 100%; 
}

/* アクセシビリティのための非表示要素 */
.st-only {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
}


@media screen and (max-width: 980px) {
	
	.footer-nav{
    	display: block;
		
		padding-bottom: 20px;
		padding-top:15px;
	}
	
	.footer-mail, .footer-tel {
	  width: 96%;
	  padding: 4% 2% 0 2%;
	}
	
	
}


@media screen and (max-width:980px){

body{
	margin-bottom: 3em;
}

.footer{
	background: #F5F5F5;
	padding: 5%;
	text-align:center;
	font-size: 1.2rem;
}

.footer-sp img{
	width: 100%;
	height:auto;
}

.footer-nav {
    position: fixed;
    bottom: 0px;
    left: 0px;
    z-index: 100;
	width: 100%;
}

.footer-mail a,
.footer-tel a{
    font-size: 1.5rem;
}

.footer-workshop-sp-inner {
	text-align: center;
	padding: 2%;
}

}

.copyr{	
	background: #eee;
	text-align:center;
	font-size:1.2rem;
	padding:10px;
	/*margin-top:30px;*/
	
}	




/* 投稿 ***********************************************/



.post h1,
.entry-content h1 {
	font-size: 136%;
	margin-bottom: 7px;
	}

.post h2,
.entry-content h2 {
	font-size: 114%;
	margin-left:0 !important;
	color: #434343!important;
	margin-bottom: 7px;
	}
	
.post p,
.entry-content p {
	line-height: 1.5;
	margin-bottom:15px;
	}	
	
.post ul,
.post ol,
.entry-content ul,
.entry-content ol{
	margin-left: 15px;
	}
	
	
.post ul li,
.entry-content ul li{
	list-style: outside;
	list-style:disc;
	}
.post ol li,
.entry-content ol li{
	list-style: outside;
	list-style:decimal;
	}


img.aligncenter {
    display: block;
    margin: 0 auto 10px;
}

img.alignright {
	padding: 4px;
	margin: 0 0 2px 7px;
	display: inline;
	}

img.alignleft {
	padding: 4px;
	margin: 0 7px 2px 0;
	display: inline;
	}

.alignright {
	float: right;
	}

.alignleft {
	float: left;
	}
/* End Images */





/* breadcrumb */

.breadcrumb {
    padding: 0 0 5px 0;
    margin: 0 10px 30px 10px;
}

.breadcrumb::-webkit-scrollbar-track {
    /*border-radius: 5px;
    background: #eee;*/
}

.workshop-breadcrumbs{
	background: #F5F5F5;
	padding-top: 30px;
}

.workshop-breadcrumbs .breadcrumb{
    padding: 0 0 5px 0;
    margin: 0 10px 0 10px;
}

.breadcrumb::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background: #999;
}

.breadcrumb ul {
    display: table; 
}

.breadcrumb ul li {
    font-size: 12px;
    font-size: 1.2rem;
    display: table-cell; /* [必須]  */
    white-space: nowrap; /* [必須] テキストを改行させないように */
    vertical-align: middle;
    padding-right: 26px;
    position: relative;
}

.breadcrumb ul li:last-child {
    padding-right: 0;
}

.breadcrumb ul li:last-child:after {
    display: none;
}

.breadcrumb ul li:after {
    position: absolute;
    display: block;
    content: '';
    content: ">";
    top: 0px;
    right: 8px;
}



.breadcrumb ol li a,
.breadcrumb ol li span {
    position: relative;
    display: block;
    top: -4px;
}

.breadcrumb ul li span {
    /*background-color: #eee;
    border-radius: 4px;
    padding: 6px 8px;*/
}

/* スクロール設定解除 */

.breadcrumb.no-scroll ul {
    display: block;
}

.breadcrumb.no-scroll ul li {
    display: inline-block;
    margin-bottom: 12px;
    white-space: normal;
}

.breadcrumb.no-scroll ul li:after {
    top: -4px;
}

@media screen and (max-width:980px){
   
   .breadcrumb {
		padding: 15px 0 5px 0;
		margin: 0 10px 10px 10px;
		}
		
	.workshop-breadcrumbs {
		padding-top: 0;
	}	
		
	.workshop-breadcrumbs .breadcrumb{
		padding-top:15px ;
	}
   
   	/*
    .breadcrumb ul li a:before {
        transform: scaleX(1);
        transition: transform 0.3s ease;
    }
    .breadcrumb ul li a:hover:before {
        transform: scaleX(0);
    }
	*/
}





/* pagetop */

/*
#page-top {
    position: fixed;
    bottom: 50px;
    right: 20px;
    font-size: 77%;
	z-index:10;
}

#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 100px;
    padding: 30px 0;
    text-align: center;
    display: block;
    border-radius: 5px;
}

#page-top a:hover {
    text-decoration: none;
    background: #999;
}

*/

#page-top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 0;
  bottom: 0;
  background: #666;
  opacity: 0.6;
  
  bottom: 80px !important;
}



#page-top a::before{
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f062';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}

/* workshop */

.site-header-links li{
	display: inline-block;
}

.site-workshop-header ul li:first-child {
    position: absolute;
    top: 5px;
    left: -160px;
}

.site-workshop-header ul li:first-child  a{
	text-decoration: none;
}







@media screen and (max-width:980px){

	#page-top{
	  bottom: 230px !important;
	  z-index:110;
	}
	
	 .banner {
		 padding-bottom:2% !important;
	 }
	
	.copyr{
		margin-bottom: 150px;
	}

}

  