/* //////////////////////////////////////////////////
[RESET]
////////////////////////////////////////////////// */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0;}
h1, h2, h3, h4, h5, h6, pre, code, address, caption, cite, code, em, strong, th, dfn, var {font-size: 1em; font-weight: 300; font-style: normal;}
/*html,h1,h2,h3,h4,h5,h6,p,li,dt,dl,dd { line-height: 1em; */
pre {
    white-space: -moz-pre-wrap; /* Mozilla */
    white-space: -pre-wrap;     /* Opera 4-6 */
    white-space: -o-pre-wrap;   /* Opera 7 */
    white-space: pre-wrap;      /* CSS3 */
    word-wrap: break-word;      /* IE 5.5+ */
font-family: Helvetica Neue, 'Open Sans', sans-serif; font-weight: 300; letter-spacing: 0.5px; line-height:1.6;}
li {list-style: none;}
caption, th {text-align: left;}
abbr, acronym {font-variant: normal;}
sup {vertical-align: text-top;}
sub {vertical-align: text-bottom;}
input, textarea, select {font: inherit;}
* {zoom: 1;}
/* CLEAR */
.clear {clear: both;}
.clearfix:after { content: "."; display: block; clear: both; height: 0; visibility: hidden;}
/* exlude MacIE5 \*/
* html .clearfix {height: 1%;}
/* end MacIE5 */

/* IMAGE */
img {vertical-align: middle; margin: 0 auto;}
/* TYPE */
body {font-size: 15px; display: block;	color: #000;
font-family: Helvetica Neue, 'Open Sans', sans-serif; font-weight: 300; letter-spacing: 1px;}
body.ja {font-size: 14px; font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, Meiryo, sans-serif; font-weight: 300; letter-spacing: 1px;}
body.ja pre {font-size: 14px; font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, Meiryo, sans-serif; font-weight: 300; letter-spacing: 0.5px;}
ul {list-style-type: none;}
ul li {}
a {color: #fff; outline: 0; text-decoration: none; cursor: pointer;}
a img {border: 0;}
strong, b, .bold {font-weight: bold;}
.normal {font-weight: normal;}
em, i, .italic {font-style: italic;}
q, blockquote {quotes: none;}
q:before, q:after, blockquote:before, blockquote:after {content: ""; content: none;}
table {border-collapse: collapse;	border-spacing: 0;}
thead, tbody, tfoot{display:block; width:100%;}
table th, table td {vertical-align: top; border: none;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {display: block;}


/* wp用 */
 
p {display: block; margin:0;}
blockquote {
    display: block;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 40px;
    -webkit-margin-end: 40px;
}
.aligncenter {display: block; margin: 0 auto;}
.alignright {float: right;}
.alignleft {float: left;}
img[class*="wp-image-"],
img[class*="attachment-"] {height: auto; max-width: 100%;}

/* TEXT-ALIGN */
.tac {text-align: center;}
.tar {text-align: right;}
.tal {text-align: left;}
/* FLOAT */
.fl {float: left;display: inline;}
.fr {float: right; display: inline;}
/* DISPLAY */
.dpi {display: inline;}
.dpb {display: block;}
/* DECORATION */
.tdn {text-decoration: none;}
/* BORDER */
.bdn {border: none !important;}
 /*----------------------------------------------------------------------- RESET*/

/* //////////////////////////////////////////////////
[COMMON]
////////////////////////////////////////////////// */

html, body{width:100%; height:auto; margin:0; padding:0;}
.inner{width:96%; max-width:960px; margin:0 auto; position:relative;}

.pc{display:inline-block;}
.sp{display:none;}


@media only screen and (max-width: 767px){
    
html, body{width:100%; height:auto; margin:0; padding:0; position:relative;}
.inner{width:96%; max-width:96%; margin:0 auto; position:relative;}

.pc{display:none;}
.sp{display:block;}

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

/*FADE*/
a.fade:hover { background-color: #fff; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=80)"; -moz-opacity: 0.8; -khtml-opacity: 0.8; opacity: 0.8; zoom: 1;}

/*********

*********/

/* //////////////////////////////////////////////////
[GLOBAL]
////////////////////////////////////////////////// */

::selection {background:#346697; color:#fff;}
::-moz-selection {background:#346697; color:#fff;}

header{width:100%; height: 100px; font-size:16px; position:fixed; top: 0; z-index: 1000; background:#fff;
border-bottom: #eee solid 1px;}
header img{height: 100%; width:auto;}
header .hinner{width: 100%; margin: 0 auto; position: relative;}
header nav ul li{cursor: pointer;}
header .logo{position: absolute; height: 60px; margin: 20px 0; left: 2%; width: 20%; box-sizing: border-box;}
header nav#globalnav{position: absolute; height: 60px; right: 0; width: 78%;}
header nav#globalnav ul{width:100%; text-align: right;}
header nav#globalnav ul li{display: inline-block;}
header nav#globalnav ul li.pro{padding: 20px 30px; line-height: 60px;}
header nav#globalnav ul li a{color: #000000; display:block; padding: 20px 25px; line-height:60px;}
header nav#globalnav ul li:hover{text-decoration: underline;}
header nav#globalnav ul li:hover a{text-decoration: underline;}
header nav#globalnav ul li.nav-contact a{color: #fff; background:#ea595b;}
header nav#globalnav ul li.nav-documents a{color: #fff; background:#2861ad;}

#productnav{position: fixed; top: 100px; left:0; width: 100%; z-index: 1000; background: #fff; display: none;
      -webkit-transition: all 0.5s ease 0s;
      -moz-transition: all 0.5s ease 0s;
      -ms-transition: all 0.5s ease 0s;
      -o-transition: all 0.5s ease 0s;
      transition: all 0.5s ease 0s;}
#productnav{text-align: center;}
#productnav li{width: 16.666% !important; float: left; font-size:20px;}
#productnav li a{line-height: 60px; display: block; width: 100%; padding:10px 0 !important; text-align:center; color:#fff !important; text-decoration:none !important;}
#productnav li:hover{opacity: 0.8;}
#productnav li:last-of-type a{background:none !important;}

footer{width:100%; clear:both; padding:0; background:#1b212a; color: #fff; line-height: 2;}
footer .finner{width: 96%; margin: 0 auto; padding: 30px 0; position: relative;}
footer .finner div{width: 24%; display: inline-block; vertical-align: top;}
footer .finner div a:hover{text-decoration: underline;}
footer .copyright{color:rgb(255, 255, 255);}
footer .palette{position: absolute; right: 0; bottom: 30px;}
footer .circlebtn{text-align: center; margin-bottom: 10px;}
footer .circlebtn a{border: #fff solid 1px; border-radius: 50px; width: 200px; line-height: 40px; display: block;}
footer .circlebtn a:hover{color: #1b212a; background:#fff;}
footer .mailto a{text-decoration: underline;}

.totop{position:fixed; bottom:40px; right:40px; width:100px; z-index: 100;}
.totop a{display: block;}
.totop img{width:100%; height:auto;}

@media (max-width: 1240px) {
header .logo{height: 40px; margin: 30px 2%; width:16%}
header .h_ntt{display: none;}
header nav#globalnav{width:82%;}
header nav#globalnav ul{text-align: right;}
header nav#globalnav ul li{font-size:12px;} 
header nav#globalnav ul li.pro{padding: 20px 20px;}
header nav#globalnav ul li a{padding: 20px 20px;}
footer .copyright{text-align: center;}
footer .palette{display: none;}    
}

@media (max-width: 1000px) {
header .logo{margin: 30px 0 30px 2%; width: 16%%; float:left;}
header nav#globalnav{position: relative; width: 82%; float:right;}
header nav#globalnav ul{text-align: right;}
}

@media (max-width: 1000px) {
header nav#globalnav ul li.pro{padding: 20px 10px;}
header nav#globalnav ul li a{padding: 20px 10px;}
}

@media only screen and (max-width: 767px){
    
header{height: 60px; font-size:14px; position:fixed; top:0; left:0;}
header .hinner{min-width: 100%;}
header .logo{position: absolute; height: 40px; margin: 10px 0; left: 2%; width: auto;}
header nav#globalnav{display:none;}

#productnav{display:none;}

footer .finner .logo{margin-bottom:20px;}
footer .finner{width: 92%;}
footer .finner div{width: 100%; display: block;}
footer .finner div ul li{width: 50%; float:left;}
footer .palette{display: block; position: relative; right: 0; bottom: 0;}
footer .circlebtn{text-align: center; margin: 20px auto; width:100%;}
footer .circlebtn a{margin:0 auto; width:100%; box-sizing:border-box;}
footer .copyright{text-align: left; font-size:10px;}
footer .spb{font-weight:bold;}
.totop{position:fixed; bottom:20px; right:20px; width:60px;}
}


#container{width:100%; height: 100%; background:url(images/top/BG_sky.jpg) no-repeat center center; background-size: cover; background-attachment: fixed; padding: 100px 0;}
#container.margintop{margin-top: 30px;}
#maincolumn{width:96%; max-width: 960px; background: #fff; margin: 0 auto;}
#maincolumn .cinner{width: 96%; max-width: 720px; margin: 0 auto;}


@media only screen and (max-width: 767px){
    
#container{background: none; padding: 60px 0 0; box-sizing:border-box;}
#container.margintop{margin-top: 0;}
#maincolumn{width:100%; max-width:100%;}
#maincolumn .cinner{width: 92%; max-width: 92%;}

}


.panadescolor{color:#45bfde;}
.etodcolor{color:#2861ad;}
.atfmcolor{color:#6dba44;}
.rdpcolor{color: #fdd000;}
.simulatecolor{color: #ea595b;}
.anycolor{color:#6a4e9d;}
.utmcolor{color:#6a4e9d;}

.panadesbg{background:#45bfde;}
.etodbg{background:#2861ad;}
.atfmbg{background:#6dba44;}
.rdpbg{background: #fdd000;}
.simulatebg{background: #ea595b;}
.anybg{background:#6a4e9d;}
.utmbg{background:#6a4e9d;}