@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
@import url('https://fonts.googleapis.com/css?family=Roboto');
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC&subset=japanese');
@import url('https://fonts.googleapis.com/css?family=Roboto+Slab&display=swap');

@charset "utf-8";
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form, label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main,summary,time,mark,audio,video,a,input,textarea{ margin:0;padding:0; border:0; font-size:100%; background:transparent; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main{ display:block;}
nav ul{ list-style:none;}
blockquote,q{ quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{ content:''; content:none;}
pre,code,kbd,samp{ font-family:monospace,monospace; font-size:inherit;}
table{ border-collapse:collapse; border-spacing:0;}
img{ border:0;}
address,caption,cite,code,dfn,em,th,var{ font-style:normal; font-weight:normal;}
caption,th{ text-align:left;}
h1,h2,h3,h4,h5,h6{ font-size:100%; font-weight:normal}
sup{ vertical-align:text-top; font-size:75%;}
sub{ vertical-align:text-bottom; font-size:75%;}
input,textarea,select{ z-index:auto; font-family:inherit; font-size:inherit; font-weight:inherit; vertical-align:middle;}
a{ outline:none;}
audio:not([controls]){ display:none;}
time{ display:inline;}
[hidden]{ display:none;}
input::-ms-clear,input::-ms-reveal,input:focus::-ms-clear,input:focus::-ms-reveal{visibility:hidden; display:none;}
button::-moz-focus-inner,input[type="reset"]::-moz-focus-inner,input[type="button"]::-moz-focus-inner,input[type="submit"]::-moz-focus-inner,input[type="file"]>input[type="button"]::-moz-focus-inner{ padding:0; border:0;}
button{cursor:pointer;}

/* ===== Common ===== */
body,input,button,select,textarea{-webkit-text-size-adjust:100%; -webkit-font-smoothing:antialiased; line-height:1; color:#231815;}
a:link{ color:#231815; text-decoration:underline;}
a:visited{ color:#231815; text-decoration:none;}
a:hover{ color:#231815; text-decoration:none;}
a:active{ color:#231815;}
*{-webkit-tap-highlight-color:rgba(0,0,0,0);}
.clr{clear:both;}
section {clear:both; zoom:1;}
article:after,section:after,.clrFx:after{content:''; clear:both; display:block;}
a,button{transition:all .2s ease-in;}
a img{transition:all .3s ease-in;}
a:hover img{opacity:0.7;}
.aCt{text-align:center;}
.mCt{margin: 0 auto;}
.aLt{text-align:left;}
.aRt{text-align:right;}
.fLt{float:left;}
.fRt{float:right;}
.sp{display:none !important;}
.pc{display:block !important;}

@media screen and (min-width:768px){
.sp{display:block!important;}
.spbr{display:none;}
.pcbr{display:inline;}
}

/* ===== Font ===== */
@font-face {
font-family: 'NotoSansJP';
font-weight: 700;
src: local('Noto Sans CJK JP Bold'),
local('NotoSansCJKjp-Bold'),
local('NotoSansJP-Bold'),
url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Bold.woff2) format('woff2'),
url(//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Bold.woff) format('woff');
}
body,button,select{font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",sans-serif;}
article h1,article h2,article h3,
article h4,article a.btn{font-family: 'NotoSansJP',"メイリオ","Meiryo";}
#siteHeader{font-family:'Noto Sans TC',"メイリオ","Meiryo";}

/* ===== Base ===== */
body{ background: url("../images/bg.jpg") left top repeat;}
#wrapper{min-width:1100px;}
article:after,section:after,.clrFx:after{content:''; clear:both; display:block;}
#siteHeader .spToggle{display:none;}
#siteHeader{padding-top: 40px;}
#siteHeader .headWrap{margin: 0 auto; padding: 10px 0;}
#siteHeader nav.gNav ul{display:flex; justify-content: center; align-items:center;}
#siteHeader nav.gNav ul li a{display: block; height: 32px;}
#siteHeader nav.gNav ul li.top{margin-right: 51px;}
#siteHeader nav.gNav ul li.pro{margin-right: 36px;}
#siteHeader nav.gNav ul li.wok{margin-right: 59px;}
#siteHeader nav.gNav ul li.blo{margin-right: 68px;}
#siteHeader nav.gNav ul li a{background: url("../images/gNav.png") no-repeat; text-indent: 100%; white-space:nowrap; overflow: hidden;}
#siteHeader nav.gNav ul li.top a{background-position:0 0; width: 54px;}
#siteHeader nav.gNav ul li.pro a{background-position:-105px 0; width: 125px;}
#siteHeader nav.gNav ul li.wok a{background-position:-265px 0; width: 84px;}
#siteHeader nav.gNav ul li.blo a{background-position:-407px 0; width: 76px;}
#siteHeader nav.gNav ul li.mai a{background-position:-549px 0; width: 69px;}
#siteHeader nav.gNav ul li.top a:hover{background-position:0 0; width: 54px;}
#siteHeader nav.gNav ul li.pro a:hover,#siteHeader nav.gNav ul li.pro a.check{background-position:-105px -40px; width: 125px;}
#siteHeader nav.gNav ul li.wok a:hover,#siteHeader nav.gNav ul li.wok a.check{background-position:-265px -40px; width: 84px;}
#siteHeader nav.gNav ul li.blo a:hover,#siteHeader nav.gNav ul li.blo a.check{background-position:-407px -40px; width: 73px;}
#siteHeader nav.gNav ul li.mai a:hover,#siteHeader nav.gNav ul li.mai a.check{background-position:-549px -40px; width: 73px;}
footer{font-family:'Noto Sans TC',"メイリオ","Meiryo"; padding: 20px 0;}
article{padding:80px 0 100px 0;}
section{max-width:1100px; padding:0px 10px; margin:0 auto;}
article strong{font-weight:bold;}
article h1.h1pTit{font-size: 1.25rem; font-weight: bold; margin-bottom: 40px;}
article h2.h2pTit{font-size: 1.15rem; font-weight: bold; margin-bottom:15px;}
article h3{margin-bottom: 20px;}
article ul{margin:0 0 30px 1.5em;}
article ul li{margin-bottom:10px;}
article p{ font-size: 1em; line-height:1.7; margin-bottom: 30px;}
article p:last-child{margin-bottom:0px;}
article figure{margin-bottom: 30px;}
article figure figcaption{font-size:15px; padding-top: 5px; text-align: center;}
article .mc{display:flex; flex-wrap:wrap; justify-content:space-between;}
article .mc .col{margin-bottom:30px; line-height: 1.5;}
article .mc.duo .col{width:calc(50% - 10px);}
article .mc.trio .col.g2{width:calc(66% - 15px);}
article .mc.trio .col{width:calc(33.5% - 15px);}
article .mc.fort .col.g3{width:calc(75% - 15px);}
article .mc.fort .col{width:calc(25% - 15px);}
article .mc.fiv .col{width:calc(20% - 10px);}
article .mc.fiv .col.g4{width:calc(80% - 10px);}

/* ===== Top ===== */
.top .mvfont{background: url("../images/topTIt.png") center top no-repeat; width:643px; height: 450px; margin: 0 auto 80px auto; text-indent: 100%; white-space: nowrap; overflow: hidden;}
.top .lead{text-align: center; font-weight: bold; line-height: 1.8;}
.top .leadCont{background: url("../images/indexImg01.png") right bottom no-repeat; padding-bottom: 150px; margin-bottom: 50px;}
.top .leadCont figure{display: none;}

/* ===== profile ===== */
.col{line-height: 1.5;}
.mlList dt,.mlList dd{text-align: center; font-weight: bold;}
.mlList dt{font-size: 1.25rem; margin-bottom: 15px;}
.mlList dd{font-size: 2.5rem; margin-bottom: 30px; line-height: 1.5;}
article.profile .col .mc.fiv{margin-top: 60px;}

/* ===== Work ===== */
.work figure img{box-shadow: 0px 10px 20px #231815;}
.work .col figure{margin-bottom: 0px;}
.work .mc{margin-bottom: 50px;}

@media screen and (max-width:768px){
#wrapper{min-width:320px; }
.sp{display:block !important;}
.pc{display:none !important;}
.fLt,.fRt{float: none;}
article .fLt{margin:0 0px 20px 0px;}
article .fRt{margin:0 0px 20px 0px;}
article img{width:100%; height:auto;}
article{padding-top: 0px;}
article img.def{width: auto; height: auto;}
section{padding:30px 15px;}
article .mc{display:block;}
article .mc .col{margin-bottom:30px;}
article .mc.duo .col,article .mc.trio .col.g2,article .mc.fort .col.g3,
article .mc.fort .col,article .mc.trio .col,article .mc.fiv .col,article .mc.fiv .col.g4{width:100%;}
#siteHeader{padding:40px 20px 20px 20px;}
#siteHeader nav.gNav ul{flex-wrap:wrap; justify-content:flex-start;}
#siteHeader nav.gNav ul li{margin-bottom:20px;}
#siteHeader nav.gNav ul li.top,#siteHeader nav.gNav ul li.pro,
#siteHeader nav.gNav ul li.wok,#siteHeader nav.gNav ul li.blo{margin-right: 30px;}
.top .mvfont{width: 100%; background-size: contain; height: 300px;}
article.profile .mc.fiv{margin: 30 0px;}
article.profile .mc.fiv .col{margin-bottom:20px;}
article.profile .mc.fiv .col{font-weight: bold;}
article.profile .mc.fiv .col.g4{font-weight:normal;}
article.work .mc.duo,article.work .mc.trio{display:flex; flex-wrap:wrap; justify-content:space-between;}
article.work .mc.duo .col,article.work .mc.trio .col{width:48%;}
.mlList dd{font-size: 2.0rem; }
.top .leadCont{background:none; padding-bottom:0px;}
.top .leadCont figure{display:block;}

}