@charset "utf-8";

@import url(//fonts.googleapis.com/css2?family=Abel&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap);

@import url(/Portals/0/mocvd/css/base.css);
@import url(/Portals/0/mocvd/css/contents.css);
@import url(/Portals/0/Skins/skinCmn.css);

/* ===========================================================
 html
=========================================================== */
/* font settings
------------------------- */
body,
html {
  /* line-height: 1.6; */
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  line-height: 1.5;
  font-size: 14px;
  color: #000;
}
body{
  font-size: 16px;
}
._Index .content_top > .inner {
  max-width: 1240px;
  padding:0 20px;
}
/* ===========================================================
 skin - breadcrumb
=========================================================== */
.breadcrumb {
  position: relative;
  z-index: inherit;
}
.breadcrumb a.breadcrumbItem[href="/jp/"],
.breadcrumb a.breadcrumbItem[href="/jp/"] + span {
  display: none;
}
.breadcrumb a.breadcrumbItem {
  font-size: 71.4288%;
}
.breadcrumb > .inner {
  max-width: 1240px;
}
.breadcrumb span.breadcrumbItem {
  font-size: 71.4288%;
  color: rgba(0,0,0,0.5);
}
.breadcrumb > .inner > span > span:not(.breadcrumbItem) {
  position: relative;
  white-space: nowrap;
  text-indent: 100%;
  overflow: hidden;
}
.breadcrumb > .inner > span > span:not(.breadcrumbItem):before {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 9px;
  height: 9px;
  border-top: 1px solid rgba(0, 0, 0, 0.5);
  border-right: 1px solid rgba(0, 0, 0, 0.5);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
#skin #main {
  overflow: hidden;
}
/* ===========================================================
 skin - sample
=========================================================== */
.colorRed,
.color_red {
  color: #ad140f;
}
.colorGray,
.color_gray {
  color: #7f7f7f;
}
a{
  color: #896e30;
}
a:hover{
  color: #896e30;
  text-decoration: underline;
  opacity: 1;
}
.js-fileicon {
  margin: 0 0 0 5px;
  vertical-align: middle;
}
/* ===========================================================
 1Column - pagetitle
=========================================================== */
.bg_page_title img{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-height: 100%;
  min-height: 220px;
  object-fit: cover;
}

.page_title_wrap {
  min-height: 220px;
  height: 100%;
  display: block;
  margin: 0 auto;
  padding: 0;
}
.page_title_wrap > .inner {
  position: absolute;
  bottom: -40px;
  left: 0;
  right: 0;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin: 0 auto;
  max-width: 1140px;
}
.editMode .page_title_wrap > .inner {
  position: static;
}
.page_title_wrap h1 {
  text-align: left;
  font-size: 2.57143rem;
}
.bg_page_title {
  position: relative;
}
.bg_page_title img {
  width: 100%;
  height: auto;
}
.PagetitleBgPane {
  width: 100%;
}
.bg_page_title:before,.bg_page_title:after {
  position: absolute;
  content: "";
  margin: auto;
  width: 20px;
  height: 20px;
}
.bg_page_title:before {
  background-image: url(/Portals/0/mocvd/images/common/ico_pagetitle_01.png);
  width: 34px;
  height: 59px;
  left: 0;
  right: inherit;
  bottom: 30px;
}
.bg_page_title:after {
  background-image: url(/Portals/0/mocvd/images/common/ico_pagetitle_02.png);
  width: 98px;
  height: 87px;
  right: 0;
  bottom: 0;
}
.editMode .page_title_wrap h1,
.editMode .sub_page_title{
  color: #fff;
}

/* ===========================================================
 1Column
=========================================================== */
/* h1~h6 settings
------------------------- */
h1 {
  font-size: 271.4289%;
  text-align: left;
}
h1:after{
  position: static;
  background: none;
  width: 0;
  height: 0;
  margin: 0;
}
h2 {
  margin-top: 120px;
  margin-bottom: 30px;
  padding-bottom: 15px;
  border-bottom: 4px solid #312d27;
  font-size: 214.286%;
}
h2:after{
  position: static;
  background: none;
  width: 0;
  height: 0;
  margin: 0;
}
h3 {
  position: static;
  margin-top: 70px;
  margin-bottom: 30px;
  text-align: left;
  padding-bottom: 15px;
  font-size: 185.714%;
  border-bottom: 1px solid #312d27;
}
h3:after {
  position: static;
  background: transparent;
  width: 0;
  height: 0;
}
h4 {
  position: relative;
  margin-top: 60px;
  margin-bottom: 30px;
  padding-left: 24px;
  font-size: 171.4288%;
}
h4:after {
  position: absolute;
  content: "";
  left: 0;
  top: 7px;
  bottom: inherit;
  width: 14px;
  height: 11px;
  background: url(/Portals/0/mocvd/images/common/ico_h4.png) 0 0 no-repeat;
}
h5 {
  position: relative;
  margin-top: 40px;
  margin-bottom: 30px;
  padding-left: 20px;
  font-size: 142.857%;
}
h5:after{
  position: absolute;
  content: "";
  left: 0;
  top: 9px;
  background:#896e30;
  width: 10px;
  height: 3px;
}
h6 {
  position: static;
  margin-top: 35px;
  margin-bottom: 30px;
  padding-left: 0;
  font-size: 114.286%;
}
h5:before,
h6:before {
  position: static;
  background: transparent;
  width: 0;
  height: 0;
}
h1 + h2,
h2 + h3,
h3 + h4,
h4 + h5{
  margin-top: 64px;
}
h5 + h6 {
  margin-top: 50px;
}
/* ===========================================================
 base.css
=========================================================== */
a:hover > .js-fileicon {
    text-decoration: underline;
}
.js-fileicon{
  display: inline-flex;
  align-items: center;
}
.js-fileicon .icon{
  display: inline-flex;
}
a .js-fileicon .icon svg {
  transition: all 0.3s ease-in-out;
}
a:hover .js-fileicon .icon svg {
  transform: rotate(45deg);
}
a.iconlink-size{
  display: inline;
}
a.iconlink-size .js-fileicon{
  display: inline-flex;
  vertical-align: text-bottom;
}
a.iconlink-size .js-fileicon .icon{
  display: inline-flex;
  align-items: center;
  margin-left: 5px;
}
a.iconlink-size:hover .js-fileicon .size_wrap,
a.iconlink-size:hover .js-fileicon .size_wrap .filetype,
a.iconlink-size:hover .js-fileicon .size_wrap .size {
  text-decoration: underline;
}
a.iconlink-size .js-fileicon {
  vertical-align: baseline;
}
a.iconlink-external:after{
  position: static;
  margin: 0;
  background: transparent;
}
a.iconlink-external .js-fileicon .size_wrap{
  display: none;
}

a[target="_blank"]:after{
  display: none;
}

.linkBtn.iconlink-external a:after,
a.linkBtn.iconlink-external:after,
.link_btn.iconlink-external a:after,
a.link_btn.iconlink-external:after{
  background: transparent;
  width: 0;
  height: 0;
}
.linkBtn a[target="_blank"] .js-fileicon svg path,
.link_btn a[target="_blank"] .js-fileicon svg path,
a.linkBtn[target="_blank"] .js-fileicon svg path,
a.link_btn[target="_blank"] .js-fileicon svg path {
    fill: #fff;
}
.linkBtn a[target="_blank"]:after,
.link_btn a[target="_blank"]:after,
a.linkBtn[target="_blank"]:after,
a.link_btn[target="_blank"]:after{
  width: 0;
  height: 0;
  opacity: 0;
  margin: 0;
}
a.link_btn.iconlink-external .js-fileicon .icon svg path,
.link_btn.iconlink-external a .js-fileicon .icon svg path{
  fill: #fff;
}
a.iconlink-external > img + .js-fileicon{
  display: none;
}
a.link_txt[class*="iconlink-"]:hover,
.link_txt a[class*="iconlink-"]:hover {
  text-decoration: underline;
}
a[target="_blank"] img + .js-fileicon{
  display: none;
}
a.link_txt.link_size_none[target="_blank"] > .js-fileicon{}
/* font family
------------------------------ */
.font_hind {
  font-family: "Hind", sans-serif;
}
/* font line
------------------------------ */
.txt_underline {
  text-decoration: underline;
}
/* font size
------------------------------ */
.txtSLarge,
.txt_Slg {
  font-size: 128.5712%;
}
.txtLarge,
.txt_lg {
  font-size: 142.857%;
}
.txtXLarge,
.txt_xlg {
  font-size: 185.714%;
}
.txtXXLarge,
.txt_xxlg {
  font-size: 214.286%;
}
.txtSmall,
.txt_sm {
  font-size: 85.714%;
}
/* font color
------------------------------ */
.colorBlue,
.color_blue{
  color: #006bb4;
}
.colorGreen,
.color_green {
  color: #5fbfbd;
}

/* list
------------------------------ */
.list1 {
  padding: 0;
}
.list1 li {
  position: relative;
  margin-bottom: 5px;
  padding-left: 24px;
  line-height: 1.5em;
  list-style: none;
}
.list1 li:before {
  content: "";
  position: absolute;
  top: calc(0.75em - 2px);
  left: 0.5em;
  width: 5px;
  height: 5px;
  background-color: #348c50;
}
/* external_link
------------------------------ */
a.external_link:hover .js-fileicon,
a.externalLink:hover .js-fileicon {
    transform: rotate(45deg);
    transform: rotate(0deg);
}
a.external_link .js-fileicon,
a.externalLink .js-fileicon {
    transition: transform 0.3s ease-in-out;
}
/* linkBtn
------------------------------ */
.linkBtn a,
.link_btn a,
a.linkBtn,
a.link_btn {
  display: inline-flex;
  text-align: left;
  background-color: #896e30;
  color: #fff;
  border-radius: 100px;
  font-weight: 700;
  line-height: 1.25;
  padding: 10px 15px 10px 20px;
}
.linkBtn a:hover,
a.linkBtn:hover,
.link_btn a:hover,
a.link_btn:hover {
  opacity:1;
  text-decoration: none;
}
.linkBtn a:after,
a.linkBtn:after,
.link_btn a:after,
a.link_btn:after {
  content: "";
  display: inline-flex;
  width: 8px;
  height: 8px;
  transform: none;
  position: relative;
  border: transparent;
  top: 0;
  bottom: 0;
  margin: auto 0;
  margin-left: 6px;
  right: 0px;
  background: url(/Portals/0/mocvd/images/common/ico_arrow.png) center center no-repeat;
  transition: transform 0.3s ease-in-out;
}
.linkBtn a:before,
a.linkBtn:before,
.link_btn a:before,
a.link_btn:before{
  position: static;
  width: 0;
  height: 0;
  border: transparent;
}
.linkBtn a:hover:after,
a.linkBtn:hover:after,
.link_btn a:hover:after,
a.link_btn:hover:after {
    transform: rotate(45deg);
    transition: all 0.3s ease-in-out;
}
/* shrink */
.linkBtn.shrink a,
a.linkBtn.shrink,
.link_btn.shrink a,
a.link_btn.shrink {
  padding: 0.5em 0.8em;
}
/* bulge */
.linkBtn.bulge a,
a.linkBtn.bulge,
.link_btn.bulge a,
a.link_btn.bulge {
  padding: 1.5em 5em;
}
/* inquiryBtn */
.linkBtn.inquiryBtn a,
a.linkBtn.inquiryBtn,
.link_btn.inquiryBtn a,
a.link_btn.inquiryBtn {
  font-size: 2rem;
  padding: 1.1em 6em 0.9em;
}
.linkBtn.inquiryBtn a:before,
a.linkBtn.inquiryBtn:before,
.link_btn.inquiryBtn a:before,
a.link_btn.inquiryBtn:before {
  content: "";
  vertical-align: middle;
  display: inline-block;
  background: url(/Portals/0/images/common/ico_inquiry.png) 0 0 no-repeat;
  transform: inherit;
  border: none;
  width: 46px;
  height: 46px;
  position: relative;
  margin: 0 18px 0 0;
  top: -4px;
  bottom: inherit;
  left: inherit;
  right: inherit;
}
/* .externalLink  */
a.linkBtn.externalLink:after,
a.linkBtn.external_link:after,
a.link_btn.externalLink:after,
a.link_btn.external_link:after,
.linkBtn a.externalLink:after,
.linkBtn a.external_link:after,
.link_btn a.externalLink:after,
.link_btn a.external_link:after {
  background:transparent;
  width: 0;
  height: 0;
}
.linkBtn a.externalLink .js-fileicon .icon svg path,
.link_btn a.externalLink .js-fileicon .icon svg path,
a.linkBtn.externalLink .js-fileicon .icon svg path,
a.link_btn.externalLink .js-fileicon .icon svg path{
  fill: #fff;
}
.linkBtn a.externalLink .js-fileicon,
.link_btn a.externalLink .js-fileicon,
a.linkBtn.externalLink .js-fileicon,
a.link_btn.externalLink .js-fileicon {
  transition: transform 0.3s ease-in-out;
}
.linkBtn a.externalLink:hover .js-fileicon,
.link_btn a.externalLink:hover .js-fileicon,
a.linkBtn.externalLink:hover .js-fileicon,
a.link_btn.externalLink:hover .js-fileicon {
  transform: rotate(45deg);
}
/* linkTxt
------------------------------ */
.linkTxt a,
a.linkTxt,
.link_txt a,
a.link_txt {
  position: relative;
  color: #896e30;
  font-weight: 700;
  padding: 0 13px 0 0;
}
.linkTxt a:hover,
a.linkTxt:hover,
.link_txt a:hover,
a.link_txt:hover {
  color: #896e30;
  text-decoration: none;
}
.linkTxt a:before,
a.linkTxt:before,
.link_txt a:before,
a.link_txt:before {
  width: 0;
  height: 0;
  content: "";
  position: relative;
  background: transparent;
}
.linkTxt a:after,
a.linkTxt:after,
.link_txt a:after,
a.link_txt:after {
  position: absolute;
  content: "";
  background: url(/Portals/0/mocvd/images/common/ico_arrow.png) 0px center no-repeat;
  width: 8px;
  height: 8px;
  filter: brightness(0) saturate(100%) invert(40%) sepia(71%) saturate(374%) hue-rotate(4deg) brightness(93%) contrast(88%);
  /*top: 0;*/
  bottom: 5px;
  right:0;
  margin-left: 4px;
  margin-top: auto;
  margin-bottom: auto;
  transition: transform 0.3s ease-in-out;
}
.linkTxt a:hover:after,
a.linkTxt:hover:after,
.link_txt a:hover:after,
a.link_txt:hover:after {
  transform: rotate(45deg);
}
.linkTxt.linkColorGreen a:before,
a.linkTxt.linkColorGreen:before,
.link_txt.linkColorGreen a:before,
a.link_txt.linkColorGreen:before {
  background-color: #5fbfbd;
}
/* linkInpage
------------------------------ */
.linkInpage a,
a.linkInpage,
.link_inpage a,
a.link_inpage {
  position: relative;
  display: inline-flex;
  background-color: transparent;
  color: #000;
  font-weight: 500;
  text-align: left;
  padding: 5px 34px 5px 0;
  line-height: 1.6;
  justify-content: inherit;
}
.linkInpage a:before,
a.linkInpage:before,
.link_inpage a:before,
a.link_inpage:before {
  position: absolute;
  content: "";
  bottom: 0;
  top: -3px;
  left: inherit;
  right: 0;
  margin: auto;
  background: none transparent;
  width: 15px;
  height: 10px;
  border: transparent;
  transform: none;
  border-top: none;
  border-left: none;
  background:#896e30;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.linkInpage a:hover,
a.linkInpage:hover,
.link_inpage a:hover,
a.link_inpage:hover {
  color: #896e30;
  opacity: 1;
  text-decoration: none;
}
/* linkInpage + layoutItem */
ul.layoutItem.linkInpage > li,
ul.layoutItem.link_inpage > li,
.layoutItem.linkInpage > *,
.layout_item.link_inpage > * {
  border-right: 1px solid #896e30;
  margin-bottom: 2%;
  padding-left: 50px;
  padding-right: 50px;
}
ul.layoutItem.linkInpage.inlined > *,
ul.layoutItem.link_inpage.inlined > * {
  margin-right: 0;
}
ul.layoutItem.linkInpage > li:last-child,
ul.layoutItem.link_inpage > li:last-child,
.layoutItem.linkInpage > *:last-child,
.layout_item.link_inpage > *:last-child {
  border-right: transparent;
}
ul.layoutItem.linkInpage > li:last-child,
ul.layoutItem.linkInpage.col2 > li:nth-child(2n),
ul.layoutItem.linkInpage.col3 > li:nth-child(3n),
ul.layoutItem.linkInpage.col4 > li:nth-child(4n),
ul.layoutItem.linkInpage.col5 > li:nth-child(5n),
ul.layoutItem.linkInpage.col6 > li:nth-child(6n),
ul.layoutItem.linkInpage.col7 > li:nth-child(7n),
ul.layoutItem.linkInpage.col8 > li:nth-child(8n),
ul.layoutItem.link_inpage > li:last-child,
ul.layoutItem.link_inpage.col2 > li:nth-child(2n),
ul.layoutItem.link_inpage.col3 > li:nth-child(3n),
ul.layoutItem.link_inpage.col4 > li:nth-child(4n),
ul.layoutItem.link_inpage.col5 > li:nth-child(5n),
ul.layoutItem.link_inpage.col6 > li:nth-child(6n),
ul.layoutItem.link_inpage.col7 > li:nth-child(7n),
ul.layoutItem.link_inpage.col8 > li:nth-child(8n)  {
  border-right: none;
}

/* layoutItem
------------------------------ */
.layoutItem.col2 > *,
.layoutItem.col3 > *,
.layoutItem.col4 > *,
.layoutItem.col5 > *,
.layoutItem.col6 > *,
.layoutItem.col7 > *,
.layoutItem.col8 > *,
.layout_item.col2 > *,
.layout_item.col3 > *,
.layout_item.col4 > *,
.layout_item.col5 > *,
.layout_item.col6 > *,
.layout_item.col7 > *,
.layout_item.col8 > * {
  margin-bottom: 2%;
  margin-top: 0;
}
ol.layoutItem > li,
ul.layoutItem > li,
ol.layout_item > li,
ul.layout_item > li {
  padding: 0;
}
ul.layoutItem.linkBtn li a,
ul.layout_item.link_btn li a {
  padding-left: 2.25em;
  padding-right: 2.25em;
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: flex-start;
}
ul.layoutItem.linkBtn li a.alignCenter,
ul.layoutItem.linkBtn.alignCenter li a,
ul.layout_item.link_btn li a.align_center,
ul.layout_item.link_btn.align_center li a {
  justify-content: center;
}
ul.layoutItem.linkBtn li a.alignLeft,
ul.layoutItem.linkBtn.alignLeft li a,
ul.layout_item.link_btn li a.align_left,
ul.layout_item.link_btn.align_left li a {
  justify-content: flex-start;
}
ul.layoutItem.linkBtn li a.alignRight,
ul.layoutItem.linkBtn.alignRight li a,
ul.layout_item.link_btn li a.align_right,
ul.layout_item.link_btn.align_right li a {
  justify-content: flex-end;
}
.layout_item:where(.col2) > *:where(:nth-child(-n+2)),
.layout_item:where(.col3) > *:where(:nth-child(-n+3)),
.layout_item:where(.col4) > *:where(:nth-child(-n+4)),
.layout_item:where(.col5) > *:where(:nth-child(-n+5)),
.layout_item:where(.col6) > *:where(:nth-child(-n+6)) {
  margin-top: 0;
}

.link_inpage.layout_item.col2 > *:nth-child(2n),
.link_inpage.layout_item.col3 > *:nth-child(3n),
.link_inpage.layout_item.col4 > *:nth-child(4n),
.link_inpage.layout_item.col5 > *:nth-child(5n),
.link_inpage.layout_item.col6 > *:nth-child(6n){
  border-right: transparent;
}
/* --------------------------------------------------
	layout
-------------------------------------------------- */
.layout_item {
  display: block;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  list-style: none;
  list-style-type: none;
  flex-direction: row;
  width: 100%;
  margin: 0 0 1em;
  padding: 0;
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
}

/* ul + layout_item
------------------------------ */
ul.layout_item li {
  margin-bottom: 1rem;
}

/* img in layout_item
------------------------------ */
.layout_item img {
  max-width: 100%;
  vertical-align: bottom;
}

/* flex
------------------------------ */
/* wraped */
.layout_item.no_wrapped {
  flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  -moz-flex-wrap: nowrap;
}
.layout_item.no_wrapped > * {
  flex: 1 0 0%;
}
/* flex-direction */
.layout_item.re_rowed {
  flex-direction: row-reverse;
}
.layout_item.columned {
  flex-direction: column;
}
.layout_item.re_columned {
  flex-direction: column-reverse;
}
/* align-items */
.layout_item.bottomed {
  -webkit-box-align: flex-end;
  -ms-flex-align: flex-end;
  -webkit-align-items: flex-end;
  align-items: flex-end;
}
.layout_item.middled {
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.layout_item.baselined {
  -webkit-box-align: baseline;
  -ms-flex-align: baseline;
  -webkit-align-items: baseline;
  align-items: baseline;
}
.layout_item.stretched {
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  -webkit-align-items: stretch;
  align-items: stretch;
}
/* justify-content */
.layout_item.lefted {
  justify-content: flex-start;
  -webkit-justify-content: flex-start;
  -ms-justify-content: flex-start;
  -moz-justify-content: flex-start;
}
.layout_item.righted {
  justify-content: flex-end;
  -webkit-justify-content: flex-end;
  -ms-justify-content: flex-end;
  -moz-justify-content: flex-end;
}
.layout_item.centered {
  justify-content: center;
  -webkit-justify-content: center;
  -ms-justify-content: center;
  -moz-justify-content: center;
}
.layout_item.betweened {
  justify-content: space-between;
  -webkit-justify-content: space-between;
  -ms-justify-content: space-between;
  -moz-justify-content: space-between;
}
/* shrink */
.layout_item.retentioned {
  flex-shrink: 0;
  -webkit-flex-shrink: 0;
  -ms-flex-shrink: 0;
  -moz-flex-shrink: 0;
}
/* basis */
.layout_item.basised > * {
  flex-basis: 100%;
}

/* column
------------------------------ */
.layout_item.col2,
.layout_item.col3,
.layout_item.col4,
.layout_item.col5,
.layout_item.col6,
.layout_item.col7,
.layout_item.col8 {
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
}
.layout_item.col2 > * {
  width: 49%;
}
.layout_item.col3 > * {
  width: 32%;
}
.layout_item.col4 > * {
  width: 23.5%;
}
.layout_item.col5 > * {
  width: 18.4%;
}
.layout_item.col6 > * {
  width: 15%;
}
.layout_item.col7 > * {
  width: 12.57%;
}
.layout_item.col8 > * {
  width: 10.75%;
}
.layout_item.col2 > *,
.layout_item.col3 > *,
.layout_item.col4 > *,
.layout_item.col5 > *,
.layout_item.col6 > *,
.layout_item.col7 > *,
.layout_item.col8 > * {
  float: none;
  margin-right: 2%;
  margin-bottom: 1rem;
}
.layout_item.col2 > *:nth-child(2n),
.layout_item.col3 > *:nth-child(3n),
.layout_item.col4 > *:nth-child(4n),
.layout_item.col5 > *:nth-child(5n),
.layout_item.col6 > *:nth-child(6n),
.layout_item.col7 > *:nth-child(7n),
.layout_item.col8 > *:nth-child(8n) {
  margin-right: 0 !important;
}

/* float
------------------------------ */
.layout_item.floated,
.layout_item.floated.col2,
.layout_item.floated.col3,
.layout_item.floated.col4,
.layout_item.floated.col5,
.layout_item.floated.col6,
.layout_item.floated.col7,
.layout_item.floated.col8 {
  display: block;
}
.layout_item.floated > *,
.layout_item.floated.col2 > *,
.layout_item.floated.col3 > *,
.layout_item.floated.col4 > *,
.layout_item.floated.col5 > *,
.layout_item.floated.col6 > *,
.layout_item.floated.col7 > *,
.layout_item.floated.col8 > * {
  display: block;
  float: left;
  margin-right: 2%;
  margin-bottom: 1rem;
}
.layout_item.floated.col2 > *:nth-child(2n + 1),
.layout_item.floated.col3 > *:nth-child(3n + 1),
.layout_item.floated.col4 > *:nth-child(4n + 1),
.layout_item.floated.col5 > *:nth-child(5n + 1),
.layout_item.floated.col6 > *:nth-child(6n + 1),
.layout_item.floated.col7 > *:nth-child(7n + 1),
.layout_item.floated.col8 > *:nth-child(8n + 1) {
  clear: left;
}
.layout_item.floated:after {
  content: "";
  display: block;
  clear: both;
}

/* tableBasic
------------------------------ */
table.tableBasic,
table.table_basic {
  margin-bottom: 2em;
  line-height: 1.5;
  border-color: #999;
}
table.tableBasic > * > tr > td,
table.tableBasic > * > tr > th,
table.table_basic > * > tr > td,
table.table_basic > * > tr > th {
  padding: 1em 1.25em;
  border-color: #999;
  border: 1px solid #999;
  background-color: #fff;
}
table.tableBasic > * > tr > th,
table.table_basic > * > tr > th {
  background-color: rgba(137, 110, 48, 0.15);
}
table.tableBasic > thead > tr > th,
table.table_basic > thead > tr > th{
  background-color: rgba(137, 110, 48, 1);
  color: #fff;
  border: 1px solid #ccc;
}

/* shrink */
table.tableBasic.shrink > * > tr > td,
table.tableBasic.shrink > * > tr > th,
table.table_basic.shrink > * > tr > td,
table.table_basic.shrink > * > tr > th {
  padding: 0.5em 1em;
}
/* bulge */
table.tableBasic.bulge > * > tr > td,
table.tableBasic.bulge > * > tr > th,
table.table_basic.bulge > * > tr > td,
table.table_basic.bulge > * > tr > th {
  padding: 1.25em 1.5em;
}

/* cell
------------------------------ */
/* color */
table.tableBasic > * > tr > *.colored,
table.table_basic > * > tr > *.colored {
  background-color: rgba(137, 110, 48, 0.05);
}

/* boxBordered && boxColored
------------------------------ */
.boxBordered,
.boxColored,
.box_bordered,
.box_colored {
  margin: 0 0 2em;
}
* + .boxBordered,
* + .boxColored,
* + .box_bordered,
* + .box_colored {
  margin-top: 3em;
}
.boxBordered,
.box_bordered {
  border: 1px solid #896e30;
  padding: 2em;
}
.boxBordered.boxColorGray,
.box_bordered.box_color_gray {
  border-color: #ccc;
}
.boxColored,
.box_colored {
  background-color: rgba(137, 110, 48, 0.15);
  padding: 2em;
}
.boxColored.boxColorGray,
.box_colored.box_color_gray {
  background-color: #f2f2f2;
}
.boxColored.boxColorBlue,
.box_colored.box_color_blue {
  background-color: rgba(0, 107, 180, 0.3);
}
.boxBordered > *:last-child,
.boxColored > *:last-child,
.box_bordered > *:last-child,
.box_colored > *:last-child {
  margin-bottom: 0;
}
.boxBordered h2:first-child,
.boxBordered h3:first-child,
.box_bordered h2:first-child,
.box_bordered h3:first-child,
.boxColored h2:first-child,
.box_colored h2:first-child,
.boxColored h3:first-child,
.box_colored h3:first-child{
  margin-top: 0;
}

/* margin
------------------------------ */
.mb0 {
  margin-bottom: 0;
}
.mb10 {
  margin-bottom: 10px;
}
.mb20 {
  margin-bottom: 20px;
}
.mb30 {
  margin-bottom: 30px;
}
.mt0 {
  margin-top: 0px;
}
.mr10 {
  margin-right: 10px;
}
.mr20 {
  margin-right: 20px;
}
.ml10 {
  margin-left: 10px;
}
.ml20 {
  margin-left: 20px;
}
.mt50 {
  margin-top: 50px;
}

/* Skins
------------------------------ */
._TNS-mocvd-en:not(._Index) .Content02 {
  background-color: rgba(137,110,48,0.15);
}
._TNS-mocvd-en:not(._Index) .content_bottom {
  background: #a7161d url(/Portals/0/mocvd/images/index/bg_content_01.png) center top no-repeat;
  background-size: 100%;
}
._TNS-mocvd-en #footer {
  margin-top: 0;
}
._TNS-mocvd-en:not(._Index) main.main_area {
  margin-bottom: 120px;
}
._TNS-mocvd-en .boxColored h2:first-child,
._TNS-mocvd-en .box_colored h2:first-child,
._TNS-mocvd-en .box_bordered h2:first-child,
._TNS-mocvd-en .boxBordered h2:first-child{
  margin-top: 0;
}
._TNS-mocvd-en._1Column .content_middle > .inner {
  /*max-width: 1140px;*/
}
/* ===========================================================
 module - tab
=========================================================== */
.ViewTabs.ui-tabs ul.ulList_vertical.ui-tabs-nav,
.moduleTabNav {
  display: flex;
  list-style-type: none;
  width: 100%;
  margin: 0 0 1em;
  padding: 0;
  flex-wrap: nowrap;
  align-items: stretch;
}
.ViewTabs.ui-tabs ul.ulList_vertical.ui-tabs-nav li,
.moduleTabNav li {
  margin: 0 20px 0 0;
  padding: 0;
  border-bottom: transparent;
  text-align: center;
  transition: border 0.3s ease-in-out;
}
.ViewTabs.ui-tabs ul.ulList_vertical.ui-tabs-nav li.ui-state-active,
.moduleTabNav li.active {
}
.ViewTabs.ui-tabs ul.ulList_vertical.ui-tabs-nav li a,
.moduleTabNav li a {
  display: block;
  font-weight: 500;
  font-size: 100%;
  line-height: 1.6;
  text-decoration: none;
  letter-spacing: 0.1em;
  padding: 10px 20px 9px;
  background: #fff;
  border:2px solid rgba(137, 110, 48, 1);
  color: #000;
  border-radius: 60px;
}
.ViewTabs.ui-tabs ul.ulList_vertical.ui-tabs-nav li a:hover,
.moduleTabNav li a:hover {
  opacity: 1;
  background-color: rgba(137,110,48,1);
  color: #fff;
}
._TNS-en .ViewTabs.ui-tabs ul.ulList_vertical.ui-tabs-nav li a,
._TNS-en .moduleTabNav li a {
  padding: 0.5em 1em 0.5em;
  letter-spacing: 0;
  word-break: break-all;
}
.ViewTabs.ui-tabs ul.ulList_vertical.ui-tabs-nav li.ui-state-active a,
.moduleTabNav li.active a {
  color: #fff;
  background: rgba(137, 110, 48, 1);
}
.ViewTabs.ui-tabs ul.ulList_vertical.ui-tabs-nav li:hover,
.moduleTabNav li:hover {
  opacity: 1;
  background-color: rgba(137, 110, 48, 1);
  border-radius: 30px;
}
/* tab_news_wrap
------------------------------ */
.tab_news_wrap {
  position: relative;
  max-width: 1400px;
  margin: 0 auto 100px;
  background-color: rgba(95, 191, 189, 0.1);
  border-radius: 50px;
  padding: 85px 0;
  width: calc(100% - 40px);
}
.tab_news_wrap ul.ulPaging {
  border-radius: 0;
  background-color: transparent;
  padding: 0;
}
.tab_news_wrap .ViewTabs.ui-tabs ul.ulList_vertical.ui-tabs-nav {
  margin: 0 0 65px;
}
@media screen and (max-width: 768px) {
  .ViewTabs.ui-tabs ul.ulList_vertical.ui-tabs-nav li,
  .moduleTabNav li{
    margin-right: 10px;
  }
  .ViewTabs.ui-tabs ul.ulList_vertical.ui-tabs-nav li a,
  .moduleTabNav li a{
    padding: 5px 15px 5px;
  }
}

/* --------------------------------------------------
	header
-------------------------------------------------- */
#header {
  position: fixed;
  top:0;
  left: 0;
  width: 100%;
  height: 80px;
  background: transparent;
}
#header.is-fix {
  box-shadow: none;
}
.editMode header#header {
    height: auto;
}
header#header .head_top {
  position: absolute;
  top: 0;
  width: 100%;
  background-image: linear-gradient(#1d1b16, transparent);
}
.editMode header#header .head_top {
    position: static;
}
header#header .head_top .inner {
  padding: 28px 40px 0;
}
header#header .head_top .inner .left {
  display: flex;
  margin: 0;
}
header#header .head_top .inner .left .logo {
  display: flex;
}
header#header .head_top .inner .right .right_item{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap:20px;
}
header .head_top .left .logo img{
  min-height: auto;
}
header .head_top .left .logo .sp_youtube_link img{
  min-width: auto;
}
header .burgerMotion{
  display: none;
}
@media screen and (max-width: 1000px) {
  header#header .head_top .inner {
    padding-top: 14px;
    padding-left: 20px;
    padding-right: 20px;
  }
  header#header .head_top .inner .right {
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
  }
}
@media screen and (max-width: 768px) {
  .sp_mb10 {
    margin-bottom: 10px;
  }
  .sp_mb20 {
    margin-bottom: 20px;
  }
  .sp_mb30 {
    margin-bottom: 30px;
  }
  .sp_mb40 {
    margin-bottom: 40px;
  }
  #header {
    position: static;
    background: #312d27;
    height: 60px;
  }
  header#header .head_top {
    position: relative;
  }
  header#header .head_top .inner {
    padding: 0;
  }
  header#header .head_top .inner .right {
    display: none;
  }
  header#header .head_top .inner .right .right_item {
    display: flex;
    flex-direction: column-reverse;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 25px 0;
    padding: 0;
  }
  header#header .head_top .inner .left {
    padding: 15px;
  }
  header#header .head_top > .inner > .right {
    position: absolute;
    top:100%;
    left: 0;
    width: 100%;
    max-height: calc(100vh - 100%);
    overflow-y: auto;
    background-color: #312d27;
    z-index: 10;
    padding: 0;
  }
  header#header .head_top .inner .left .logo {
    margin-right: 55px;
    padding: 0;
    width: 100%;
    align-items: center;
    justify-content: space-between;
  }
  .burger-overlay {
    top:inherit;
    bottom: 0;
    height: calc(100% - 60px);
  }
  header .burgerMotion{
    display: block;
  }
  header#header .burgerMotion p span,
  header#header .burgerMotion p span:after,
  header#header .burgerMotion p span:before{
    background-color: #fff;
    width: 20px;
    height: 2px;
  }
  header#header .burgerMotion p span:before{
    margin-top: -6px;
  }
  header#header .burgerMotion p span:after{
    margin-top: 6px;
  }
  header#header .burgerMotion.open p span:before,
  header#header .burgerMotion.open p span:after{
    margin-top: 0;
  }
  header#header .burgerMotion.open p span {
    background: transparent;
  }
}
.logo_area a {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.6vw;
  transition: auto;
}
.logo_area a .logo_text {
  font-size: 128.5712%;
  font-style: italic;
  color: #fff;
}
.logo_area a:hover {
  text-decoration: none;
  opacity: 0.7;
}
.link_area {
  display: flex;
  gap: 20px;
  align-items: center;
}
.link_area .link_item {
  display: flex;
  gap: 20px;
}
.token_menu > ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  padding: 0;
  list-style: none;
}
.token_menu > ul li {
  display: none;
  padding-bottom: 0;
  padding-left: 0;
}
.token_menu > ul li a {
  display: block;
  color: #fff;
  font-size: 114.2856%;
  font-style: italic;
  font-weight: 700;
  transition: opacity 0.3s ease-in-out;
  z-index: 1;
}
.token_menu > ul > li.currentItem > a{
  color: #896e30;
}
.token_menu > ul li a:hover {
  opacity: 0.7;
  text-decoration: none;
}
.token_menu > ul li.Tab463,
.token_menu > ul li.Tab465,
.token_menu > ul li.Tab473,
.token_menu > ul li.Tab475,
.token_menu > ul li.Tab477 {
  display: flex;
  align-items: center;
  flex-direction: column;
  position: relative;
  margin-left: 20px;
  padding-left: 7px;
}
.token_menu > ul > li:before {
  position: absolute;
  content: "";
  top: 8px;
  left: 0;
  margin: auto;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.5);
}
.token_menu > ul > li:after{
  position:absolute;
  content:"";
}
.token_menu > ul > li:hover > ul {
  position: absolute;
  width: 140px;
  opacity: 1;
  padding-top: 30px;
  visibility: visible;
  display: block;
  top:0;
  left:52%;
  transform: translateX(-50%);
  margin: auto;;
  padding-left: 0;
}
.token_menu > ul li ul {
  display: none;
}
.token_menu > ul > li > ul > li {
  position: relative;
  display: block;
  margin-left: 0;
}
.token_menu > ul > li > ul > li.Tab457{
  align-items: flex-start;
  margin-left: 0;
  padding-left: 0;
}
.token_menu > ul > li > ul > li.currentItem {
  background: #46433e;
}
.token_menu > ul > li > ul > li a {
  display: block;
  font-style: normal;
  font-size: 100%;
  padding-left: 10px;
  padding-right: 10px;
  width: 100%;
}
.token_menu > ul > li > ul > li {
  position: relative;
  padding: 10px 0;
  background: #312d27;
  transition: all 0.3s ease-in-out;
}
.token_menu > ul > li > ul > li:before {
  position: absolute;
  content: "";
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: calc(100% - 20px);
  height: 1px;
  background: rgba(255,255,255,0.5);
}
.token_menu > ul > li > ul > li:last-child:before,
.token_menu > ul > li > ul > li > ul > li:last-child:before {
  position: relative;
  width: 0;
  height: 0;
  background-color: transparent;
}
.token_menu > ul > li > ul > li:hover {
   background: #45413c;
}
.token_menu > ul > li:hover > ul:before {
  position: absolute;
  content: "";
  top: 24px;
  left: 0;
  right: 0;
  margin: auto;
  background: #312d27;
  clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
  width: 13px;
  height: 9px;
}
.token_menu > ul > li > ul > li:hover > a {
  opacity: 1;
}
.token_menu > ul > li > ul > li > ul {
  padding: 0;
}
.token_menu > ul > li > ul > li:hover ul {
  display: block;
  position: absolute;
  top: 0;
  left: 100%;
  z-index: -100;
  width: 100%;
  margin: auto;
  padding-top: 0;
  transform: none;
}
.token_menu > ul > li > ul > li.currentItem > ul {
  background: #46433e;
}
.token_menu > ul > li > ul > li > ul > li {
  display: block;
  position: relative;
  padding: 10px 0;
  background: #46433e;
}
.token_menu > ul > li > ul > li > ul > li:before {
  position:absolute;
  content:"";
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: calc(100% - 20px);
  height: 1px;
  background: rgba(255,255,255,0.5);
}
.token_menu > ul > li > ul > li > ul > li > a {
  transition: all 0.3s ease-in-out;
}
.token_menu > ul > li > ul > li > ul > li > a:hover {
  color: #896e30;
  opacity: 1;
}
/**/
@media screen and (max-width: 1072px) {
  .head_right_item {
  }
  header#header .head_top .inner .right .right_item {
    align-items: flex-start;
  }
  header#header .head_top .inner {
  }
}
/**/
@media screen and (max-width: 768px) {
  .layoutItem.firstitemlefted > *:first-child,
  .layoutItem.firstitemrighted > *:first-child{
    float: none;
    margin:0;
  }
  .logo_area a .logo_text {
    font-size: 114.286%;
  }
  .logo_area a {
    align-items: flex-end;
    gap: 20px;
  }
  .token_menu > ul {
    display: block;
    padding: 0 20px;
  }
  .token_menu > ul li {
    display: block;
  }
  .token_menu > ul li.Tab463,
  .token_menu > ul li.Tab465,
  .token_menu > ul li.Tab473,
  .token_menu > ul li.Tab475,
  .token_menu > ul li.Tab477 {
    margin-left: 0;
    padding: 0;
    display: block;
  }
  .token_menu > ul > li {
    border-bottom: 1px solid rgba(255,255,255,0.5);
  }
  .token_menu > ul > li:first-child {
    border-top: 1px solid rgba(255,255,255,0.5);
  }
  .token_menu > ul > li:before {
    width: 0;
    height: 0;
    position: static;
  }
  .token_menu > ul li a {
    display: block;
    width: 100%;
    position: relative;
    padding: 20px 26px 20px 0;
    font-size: 1rem;
    transition: all 0.3s ease-in-out;
  }
  .token_menu > ul li a:hover {
    color: #896e30;
  }
  .token_menu > ul li a.currentLink {
    color: #896e30;
  }
  .link_area{
    padding: 16px 20px 0 20px;
  }
  .link_area > *:not(.link_item) {
    display: none;
  }
  .link_area .link_item > * {
    width: 100%;
  }
  .link_area {
    display: block;
  }
  .head_left_item {
    width: 100%;
  }
  .head_right_item {
    display: block;
    width: 100%;
  }
  .link_area .link_item > * a {
    width: 100%;
    text-align: center;
    justify-content: center;
  }
  /* burger */
  .token_menu > ul > li > ul {
    display: none;
    width: 100%;
    background-color: #3c3832;
    padding:0;
  }
  .token_menu > ul li.Tab463,
  .token_menu > ul li.Tab465,
  .token_menu > ul li.Tab473,
  .token_menu > ul li.Tab475,
  .token_menu > ul li.Tab477{
    margin:0;
    padding:0;
  }
  .token_menu > ul li.Tab471{
    display: none;
  }
  .token_menu > ul > li > ul li {
    padding: 0;
    background: #3c3832;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  }
  .token_menu > ul > li > ul > li:before{
    position: relative;
    background:none;
    width: 0;
    height: 0;
  }
  .token_menu > ul > li > ul li a {
    padding: 20px 26px 20px 10px;
    font-size: 1rem;
  }
  .token_menu > ul > li > ul li ul {
    padding-left: 20px;
    padding-top: 0;
    padding-bottom: 0;
  }
  .token_menu > ul > li > ul li ul li {
    padding:0;
    background: #46423d;
  }
  .token_menu > ul > li > ul li ul li:last-child {
    border-bottom: transparent;
  }
  .token_menu > ul > li > ul li ul li a {
    padding: 16px 10px;
  }
  .token_menu > ul li a .toggleBtn {
    display: block;
    position: absolute;
    top: 18px;
    right: 8px;
    width: 25px;
    height: 25px;
    margin: auto;
  }
  .token_menu > ul li a .toggleBtn:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 16px;
    height: 2px;
    margin: auto;
    background: #fff;
  }
  .token_menu > ul > li a .toggleBtn:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 2px;
    height: 16px;
    margin: auto;
    background: #fff;
    transition: transform 0.3s ease-in-out;
  }
  .token_menu > ul > li a.open .toggleBtn:after {
    transform: rotate(90deg);
  }
  .page_title_wrap > .inner {
    bottom: 0;
  }
  .token_menu > ul > li:hover > ul {
    position: relative;
    left: inherit;
    transform: none;
    display: none;
    width: 100%;
    padding-top: 0;
  }
  .token_menu > ul > li > ul > li:hover {
    background-color: transparent;
  }
  .token_menu > ul > li > ul > li:hover ul {
    display: none;
    position: relative;
    left: inherit;
    padding-top: 0;
    z-index: inherit;
  }
  .token_menu > ul > li > ul > li > ul > li:before {
    position: static;
    width: 0;
    height: 0;
    background-color: transparent;
  }
  ._TNS-mocvd-en #footer {
    padding-top: 50px;
    background: url(/Portals/0/mocvd/images/index/bg_footer_sp.png) center bottom no-repeat;
    background-size: cover;
  }
  ._TNS-mocvd-en:not(._Index) #footer{
    padding-top: 0;
  }
  ._TNS-mocvd-en:not(._Index) #footer:before{
    width: 0;
    height: 0;
    background-color: transparent;
  }
  .ViewTabs.ui-tabs ul.ulList_vertical.ui-tabs-nav,
  .moduleTabNav{
    flex-wrap: wrap;
    gap: 10px 0;
  }
}






.pagetop_wrap {
}
.pagetop_wrap .pagetop a {
  width: 50px;
  height: 50px;
  background: rgba(255,255,255,0.2);
}
.pagetop_wrap .pagetop.is-dark a {
  background: rgba(0,0,0,0.2);
}
.pagetop_wrap .pagetop a:before {
  width: 15px;
  height: 15px;
  border: transparent;
  background: url(/Portals/0/mocvd/images/common/ico_arrow.png) center center no-repeat;
  transform: rotate(-45deg);
  top: 0;
}
.pagetop_wrap .pagetop.fix {
  bottom: -75px;
  top: inherit;
}
/* --------------------------------------------------
	footer
-------------------------------------------------- */
#footer {
  position: relative;
  background: url(/Portals/0/mocvd/images/index/bg_footer.png) bottom center no-repeat;
  width: 100%;
  /* height: 100%; */
  min-height: 270px;
  background-size: cover;
}
#footer .fotter_wrap {
  padding: 45px 0;
}
#footer .footer_item {
    display: flex;
    justify-content: space-between;
    padding: 0px 20px;
    max-width: 1140px;
    margin: 0 auto;
}
.footer_logo_area {
    margin-bottom: 50px;
}
.footer_logo_area a:hover {
  text-decoration: none;
  opacity: 0.7;
}
.footer_logo_area a .logo_text{
  color: #fff;
  vertical-align: text-bottom;
  margin-left: 26px;
  font-style: italic;
}
.fotter_bottom {
    display: flex;
    align-items: center;
    gap: 30px;
}
.fotter_bottom > * a {
    color: #fff;
    font-size: 85.714%;
    padding-top: 10px;
    padding-bottom: 10px;
}
.fotter_bottom > * a.ico_youtube {
  position: relative;
  display: block;
  padding-left: 43px;
}
.fotter_bottom > * a.ico_youtube:before {
  position:absolute;
  content:"";
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 34px;
  height: 24px;
  background: url(/Portals/0/mocvd/images/common/ico_youtube.png) 0 0 no-repeat;
  background-size: 100%;
}
#footer .footer_item .foot_right .copyright {
  font-size: 0.85714rem;
}

@media screen and (max-width: 768px) {
  .footer_logo_area{
    margin-bottom: 40px;
  }
  ._TNS-mocvd-en #footer:before {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    top:50px;
    margin: auto;
    width: calc(100% - 40px);
    height: 1px;
    background-color: rgba(255,255,255,0.5);
    z-index: 0;
  }
  .pagetop_wrap .pagetop.fix {
    bottom: 257px;
  }
  #footer .footer_item{
    flex-direction: column;
  }
  .fotter_bottom{
    flex-wrap:wrap;
    gap: 10px 30px;
    margin-bottom: 38px;
  }
  .fotter_bottom > *:first-child{
    width: 100%;
  }
  .fotter_bottom > * a{
    font-size: 75%;
  }
}