@charset "UTF-8";
/* Reset Stylesheet Based on - html5doctor.com Reset Stylesheet http://html5doctor.com/html-5-reset-stylesheet/ */
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, small, 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, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
table { border-collapse: collapse; border-spacing: 0; }
input, select { vertical-align: middle; }
ul, li { list-style: none; }
/*-------------------------------------
clearfix
-------------------------------------*/
.clearfix:before,.clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/*-------------------------------------
common
-------------------------------------*/
body { font: 75%/1.5 "Oswald", sans-serif, Arial, Helvetica, Verdana, "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック"; font-weight: 300; letter-spacing: .05em; -webkit-text-size-adjust: 100%; }
a { text-decoration: none; cursor: pointer; color: rgb(0,120,210); }
a:hover { text-decoration: underline; }
a:focus { outline: none; }
h1 { }
h2 { font-size: 48px; font-weight: 300; }
h3 { font-size: 18px; font-weight: 300; }
h4 { font-size: 18px; font-weight: 300; }
p, dl, ul { font-size: 18px; }
input, select, table { font-size: 16px; }
img { vertical-align: bottom; }
.inner { max-width: 1080px; margin: 0 auto; padding: 0 2%; box-sizing: border-box; }
.error { color: rgb(210,0,0); line-height: 200%; }
.black { background: rgb(0,0,0); }
.line-black { border-left: 1px solid rgb(0,0,0); box-sizing: border-box; }

/*-------------------------------------
header
-------------------------------------*/
header { width: 100%; min-width: 1200px; }
.global-header { padding: 15px 0 25px; }
.global-header .masa { width: 110px; float: left; margin-right: 30px; }
.global-header .mmw { width: 400px; float: left; }
.global-header .jsmea { width: 140px; float: right; margin-top: 20px; }

/*-------------------------------------
visual
-------------------------------------*/
.visual { width: 100%; min-width: 1200px; }
.visualinner { height: 900px; position: relative; overflow: hidden; }

.visual .videowrap { width: 100%; height: 100%; background: url("../images/dot.png") rgba(0,0,0,0.1); }
.visual .videoclip { min-height: 100%; min-height: 100vh; min-width: 100%; min-width: 100vw; position: absolute; top: 0; left: 0; z-index: -1; }
.visual .videoclip-img { display: none; min-height: 100%; min-height: 100vh; min-width: 100%; min-width: 100vw; background: url("../images/video.png"); background-size: auto; background-size: cover; position: absolute; top: 0; left: 0; z-index: -1; }

.visual .flag { width: 180px; position: absolute; top: 50px; left: 100px; z-index: 2; }
.visual .masa-jsmea { width: 380px; position: absolute; top: 70px; left: 0; right: 0; margin: auto; background-color: rgb(255,255,255); padding: 14px 20px; z-index: 2; }

.visual .headliine { text-align: center; color: rgb(255,255,255); width: 1200px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -40%); z-index: 1; }

.visual .headliine h1 { font-size: 70px; font-weight: 600; line-height: 120%; }
.visual .headliine h2 { font-size: 40px; font-weight: 300; margin-top: 20px; letter-spacing: .08em; background-color: rgba(0,20,30,0.4); padding: 5px 30px 20px; display: inline-block; }
.visual .headliine h2 span { font-size: 30px; }
.visual .headliine p { font-size: 28px; font-weight: 300; margin-top: 20px; letter-spacing: .08em; }

/*-------------------------------------
contents
-------------------------------------*/
.contents { width: 100%; min-width: 1200px; display: block; position: relative; z-index: 2; background: rgb(255,255,255); }
.contents .company-logo { width: 100%; height: 130px; margin: 10px 0; background: url(../images/head_company_logo.gif) repeat-x center; background-size: 4000px; }

/*-------------------------------------
block
-------------------------------------*/
.block { }
.block1 { }
.block2 { background-color: rgba(0,0,0,0.04); }
.block3 { background: url("../images/bg3.png") repeat center center; }
.block4 { background: url("../images/bg4.jpg") repeat center center; background-size:cover; }
.block4 .inner .wrap { padding: 80px 0; }
.block5 { background: url("../images/bg5.jpg") repeat center center; background-size:cover; }
.block5 .inner .wrap { padding: 50px 0; }
.block6 { background: url("../images/bg6.gif") repeat center center; }

.block .wrap { padding: 30px 0; margin-left: 40px; display: block; }
.block .headline { margin-left: -40px; font-size: 28px; letter-spacing: .1em; }
.block .headline .time1 { width: 80px; height: 80px; margin-right: 20px; font-size: 18px; font-weight: 300; line-height: 80px; text-align: center; display: inline-block; background: rgb(255,255,255); border-radius: 40px; border: 1px solid rgb(0,0,0); letter-spacing: .1em; }
.block .headline .time2 { width: 150px; height: 80px; margin-right: 20px; font-size: 18px; font-weight: 300; line-height: 80px; text-align: center; display: inline-block; background: rgb(255,255,255); border-radius: 40px; border: 1px solid rgb(0,0,0); letter-spacing: .1em; }
.block .headline .session { color: rgb(20,80,120); font-size: 24px; letter-spacing: .1em; margin-left: 20px; }

.block .headline .coffee { height: 50px; margin: 0 0 0 10px; background: rgba(255,255,255,.8); padding: 20px 80px; border-radius: 4px; display: inline-block; text-shadow: 1px 1px 0px rgb(255,255,255); }
.block .headline .network { height: 50px; margin: 0 0 0 10px; background: rgba(255,255,255,.8); padding: 20px 80px; border-radius: 4px; display: inline-block; text-shadow: 1px 1px 0px rgb(255,255,255); }

.block .time-line1 { padding: 15px 0px 15px 70px; display: block; }
.block .time-line1 .logo { float: left; margin-right: 30px; }
.block .time-line1 .profile { float: left; }
.block .time-line1 .profile .name { font-size: 21px; line-height: 100%; }
.block .time-line1 .profile .position { margin-top: 4px; }
.block .time-line1 .logo-jsmea { max-width: 180px; margin: 12px 0; }
.block .time-line1 .logo-masa { max-width: 140px; margin: 0 20px 0 20px; }

.block .time-line1-2 { padding: 50px 0px 20px 20px; display: block; }
.block .time-line1-2 .time { padding: 8px 15px; float: left; color: rgb(255,255,255); border-radius: 50px; font-size: 18px; }
.block .time-line1-2 .logo { float: left; text-align: center; margin: 15px 30px 0 100px; }
.block .time-line1-2 .profile { float: left; text-shadow: 1px 1px 0px rgb(255,255,255); }
.block .time-line1-2 .profile .name { font-size: 24px; line-height: 100%; }
.block .time-line1-2 .profile .position { margin-top: 4px; }
.block .time-line1-2 .speech { display: block; text-align: center; padding: 5px 0; margin: 0 0 30px 100px; color: rgb(255,255,255); background: rgb(20,80,120); border-radius: 24px; width: 300px; }
.block .time-line1-2 .logo-jsmea { max-width: 180px; }
.block .time-line1-2 .logo-classnk { max-width: 160px; }
.block .time-line1-2 .logo-filipino { max-width: 115px; }
.block .time-line1-2 .comingsoon { margin-left: 120px; }

.company-list { margin-left: -40px; }
.company-list li { margin-top: 30px; border-top: 3px solid rgb(20,80,120); box-shadow: 0 3px 3px rgb(240,240,240); }
.company-list li a { display: block; padding: 40px 0; color: rgb(0,0,0); background: rgb(255,255,255); transition: .2s; }
.company-list li a:hover { color: rgb(20,80,120); transform: scale(1.1, 1.1); }
.company-list li a .more { display: block; padding: 8px 50px; color: rgb(20,80,120); background: rgb(255,255,255); border: 1px solid rgb(20,80,120); border-radius: 50px; transition: .2s; }
.company-list li a:hover .more { color: rgb(255,255,255); background: rgb(20,80,120); border: 1px solid rgb(20,80,120); border-radius: 50px; }
.company-list-logo { float: left; width: 40%; }
.company-list-logo figure { text-align: center; }
.company-list-logo .tokyokeiki img { width: 140px; padding-top: 84px; }
.company-list-logo .daihatsu img { width: 180px; padding-top: 78px; }
.company-list-logo .bemac img { width: 150px; padding-top: 90px; }
.company-list-logo .yanmar img { width: 200px; padding-top: 85px; }
.company-list-logo .ihi img { width: 205px; padding-top: 70px; }
.company-list-info { float: left; width: 55%; padding-right: 5%; }
.company-list-info .time { font-size: 24px; letter-spacing: 0.2em; }
.company-list-info .name { font-size: 20px; line-height: 100%; margin: 5px 0; }
.company-list-info .title { font-size: 30px; color: rgb(20,80,120); }
.company-list-info .more { margin-top: 15px; float: left; }

/*-------------------------------------
company-logo-list
-------------------------------------*/
.company-logo-list { padding: 60px 0; }
.company-logo-list h2 { padding-bottom: 10px; text-align: center; text-shadow: 1px 1px 0px rgb(255,255,255); border-top: 1px solid rgb(0,0,0); border-bottom: 1px solid rgb(0,0,0); }
.company-logo-list table { width: auto; display: block; margin-top: 30px; background: rgb(255,255,255); }
.company-logo-list table tbody { width: 100%; }
.company-logo-list table td { width: 350px; height: 200px; text-align: center; border: 1px solid rgb(240,240,240); box-sizing: border-box; vertical-align: middle; }
.company-logo-list table td a { display: inline-block; }
.company-logo-list table td a img { width: 350px; transition: 0.2s; }
.company-logo-list table td a img:hover { transform: scale(1.2, 1.2); }
.company-logo-list .logo-bemac img { max-width: 140px; }
.company-logo-list .logo-daihatsu img { max-width: 160px; }
.company-logo-list .logo-ihi img { max-width: 185px; }
.company-logo-list .logo-tokyokeiki img { max-width: 130px; }
.company-logo-list .logo-yanmar img { max-width: 185px; }

/*-------------------------------------
about
-------------------------------------*/
.about { padding: 60px 0; }
.about h2 { padding-bottom: 10px; text-align: center; text-shadow: 1px 1px 0px rgb(255,255,255); border-top: 1px solid rgb(0,0,0); border-bottom: 1px solid rgb(0,0,0); }
.about table { width: 100%; margin-top: 30px; background: rgb(255,255,255); }
.about table th { width: 30%; padding: 25px; text-align: left; border: 1px solid rgb(0,0,0); background: rgb(250,250,250); font-weight: 300; box-sizing: border-box; }
.about table td { width: 70%; padding: 25px; border: 1px solid rgb(0,0,0); box-sizing: border-box; }

/*-------------------------------------
company
-------------------------------------*/
.company-header { background: rgb(20,80,120); }
.company-header .seminar-logo { float: left; width: 323px; padding-top: 13px; }
.company-header .time-nav { float: right; }
.company-header .time-nav li { float: left; letter-spacing: .2em; }
.company-header .time-nav li a { display: block; color: rgb(255,255,255); background: rgb(30,120,160); position: relative; }
.company-header .time-nav li a:hover { color: rgb(255,255,255); background: rgba(0,0,0); text-decoration: none; transition: .2s; }
.company-header .time-nav li.prev a { padding: 24px 30px 24px 40px; }
.company-header .time-nav li.prev a:before { content: ''; position: absolute; top: 50%; left: 0; width: 0; height: 0; margin-left: 20px; margin-top: -5px; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-right: 6px solid rgb(255,255,255); border-left: 6px solid transparent; }
.company-header .time-nav li.next a { padding: 24px 40px 24px 30px; }
.company-header .time-nav li.next a:after { content: ''; position: absolute; top: 50%; right: 0; width: 0; height: 0; margin-right: 20px; margin-top: -5px; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-right: 6px solid transparent; border-left: 6px solid rgb(255,255,255); }
.company-header .time-nav .selected { display: block; padding: 24px 40px; color: rgb(0,0,0); background: rgb(255,255,255); }

.company-breadcrumbs { background: rgb(255,255,255); border-bottom: 2px solid rgb(20,80,120); }
.company-breadcrumbs ul { display: block; }
.company-breadcrumbs li { float: left; padding: 15px 0 15px 35px; line-height: 100%; letter-spacing: .05em; position: relative; }
.company-breadcrumbs li:first-child { padding: 15px 0 15px 0; }
.company-breadcrumbs li a { color: rgb(20,80,120); }
.company-breadcrumbs li a:after { content: ''; position: absolute; top: 50%; right: 0; width: 0; height: 0; margin-right: -28px; margin-top: -5px; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-right: 6px solid transparent; border-left: 6px solid rgb(20,80,120); }

.company-cover { padding: 30px 0; }
.company-cover .time { float: left; font-size: 28px; letter-spacing: .2em; color: rgb(20,80,120); }
.company-cover .time span { display: block; font-size: 20px; padding-left: 30px; background: url("../images/icon_time.png") no-repeat center left; background-size: 20px; }
.company-cover .sponsor { float: right; width: 180px; }
.company-cover .logo { padding: 40px 0 10px; text-align: center; }
.company-cover .logo span { display: block; padding-top: 20px; font-size: 20px; font-weight: 300; letter-spacing: .1em; }
.company-cover .logo-tokyokeiki img { max-width: 155px; }
.company-cover .logo-daihatsu img { max-width: 200px; }
.company-cover .logo-bemac img { max-width: 165px; }
.company-cover .logo-yanmar img { max-width: 230px; }
.company-cover .logo-ihi img { max-width: 230px; }

.company { display: block; padding-bottom: 40px; }
.company .title { padding: 6px 15px 8px; text-align: center; font-size: 30px; color: rgb(255,255,255); background: rgb(20,80,120); }
.company .title .r-mark { font-size: 22px; vertical-align: top; }
.company .subtitle { width: 600px; margin: 0 auto; padding: 10px; text-align: center; color: rgb(20,80,120); background: rgb(255,255,255); border: solid 1px rgb(20,80,120); border-radius: 2em; }

.company .presentation { margin-bottom: 60px; }
.company .presentation h4 { font-size: 28px; color: rgb(20,80,120); text-align: center; margin-bottom: 10px; }
.company .presentation p { margin-top: 20px; }
.company .presentation figure { margin-top: 30px; text-align: center; }

.company .presentation .tokyokeiki img { max-width: 600px; }
.company .presentation .bemac img { max-width: 100%; }
.company .presentation .daihatsu img { max-width: 100%; }
.company .presentation .ihi img { max-width: 900px; }
.company .presentation .yanmar img { max-width: 680px; }

.company .download { margin-bottom: 40px; }
.company .download .tokyokeiki-pdf { float: left; width: 27.333333333333333%; text-align: center; margin: 40px 3% 0; }
.company .download .bemac-pdf { float: left; width: 42%; text-align: center; margin: 40px 4% 0; }
.company .download .daihatsu-pdf { float: left; width: 27.333333333333333%; text-align: center; margin: 40px 3% 0; }
.company .download .ihi-pdf { float: left; width: 42%; text-align: center; margin: 40px 4% 0; }
.company .download .yanmar-pdf { float: left; width: 30%; text-align: center; margin: 40px 10% 0; }

.company .download a { display: block; }
.company .download a:hover .pict { opacity: 0.8; transition: all 0.2s ease 0s; }

.company-infomation { background: rgb(20,80,120); }
.company-infomation .title { float: left; width: 20%; padding: 100px 0; text-align: center; font-size: 18px; color: rgb(20,80,120); background: rgb(255,255,255); letter-spacing: .2em; }
.company-infomation .title-kamome { padding: 116px 0; }
.company-infomation .info { float: left; width: 80%; padding: 20px 20px 0; background: rgb(20,80,120); box-sizing: border-box; }
.company-infomation .info h2 { font-size: 21px; color: rgb(255,255,255); }
.company-infomation .info ul { color: rgb(255,255,255); }
.company-infomation .info li { float: left; margin: 10px 30px 0 0; padding: 10px 0 10px 50px; }
.company-infomation .info p { display: block; margin-top: 5px; padding: 10px 0 10px 50px; color: rgb(255,255,255); }
.company-infomation .info p a { color: rgb(255,255,255); }
.company-infomation .info .tel { background: url("../images/icon_tel.png") no-repeat 0; background-size: 40px; }
.company-infomation .info .fax { background: url("../images/icon_fax.png") no-repeat 0; background-size: 40px; }
.company-infomation .info .mail { background: url("../images/icon_mail.png") no-repeat 0; background-size: 40px; }
.company-infomation .info .url { background: url("../images/icon_url.png") no-repeat 0; background-size: 40px; }

/*-------------------------------------
footer
-------------------------------------*/
footer { width: 100%; min-width: 1200px; background: rgb(0,0,0); }
footer .seminar-copy { text-align: center; padding: 15px 0 20px; background: rgb(20,80,120); }
footer .seminar-copy img { width: 640px; }
footer .copyright { padding: 15px 0px 20px; text-align: center; color: rgb(255,255,255); background: rgb(0,0,0); }



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

/*-------------------------------------
visual
-------------------------------------*/
.visualwrap { height: 720px; }

}