@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');
@font-face {
    font-family: SourceHanCodeJP-Bold;
    src: url(font/SourceHanCodeJP-Normal.otf);
    font-weight: 300;
}
@font-face {
    font-family: SourceHanCodeJP-Bold;
    src: url(font/SourceHanCodeJP-Medium.otf);
    font-weight: 400;
}
@font-face {
    font-family: SourceHanCodeJP-Bold;
    src: url(font/SourceHanCodeJP-Light.otf);
    font-weight: 500;
}
@font-face {
    font-family: SourceHanCodeJP-Bold;
    src: url(font/SourceHanCodeJP-Regular.otf);
    font-weight: 600;
}
@font-face {
    font-family: SourceHanCodeJP-Bold;
    src: url(font/SourceHanCodeJP-Heavy.otf);
    font-weight: 700;
}
@font-face {
    font-family: SourceHanCodeJP-Bold;
    src: url(font/SourceHanCodeJP-ExtraLight.otf);
    font-weight: 800;
}
@font-face {
    font-family: SourceHanCodeJP-Bold;
    src: url(font/SourceHanCodeJP-Bold.otf);
    font-weight: 900;
}
:root{
/* Colors: */
--color-707070: #707070;
--color-777777: #777777;
--color-A0A0A0: #A0A0A0;
--color-00ACBA: #00ACBA;
--color-555555: #555555;
--color-A3A3A3: #A3A3A3;
--color-ECF6F8: #ECF6F8;
--color-F8F8F8: #F8F8F8;
--color-D5D5D5: #D5D5D5;
--color-DFEEF2: #DFEEF2;
--color-C8DDE6: #C8DDE6;
--color-A6BBD2: #A6BBD2;
--color-30B0C1: #30B0C1;
--color-0074AA: #0074AA;
--color-41668B: #41668B;
--color-1B224C: #1B224C;
--color-8E8E8E:#8E8E8E;
--color-5AADBF : #5AADBF;
--color-ffffff : #ffffff;
/* Font Size */
--letter-spacing: 0;
--font-size-12: 12px;
--font-size-14: 14px;
--font-size-15: 15px;
--font-size-16: 16px;
--font-size-18: 18px;
--font-size-22: 22px;
--font-size-26: 26px;
--font-size-30: 30px;
--font-size-32: 32px;
--font-size-36: 36px;
--font-size-38: 38px;
--font-size-40: 40px;
--line-spacing-18: 18px;
--line-spacing-22: 22px;
--line-spacing-24: 24px;
--line-spacing-26: 26px;
--line-spacing-28: 28px;
--line-spacing-30: 30px;
--line-spacing-32: 32px;
--line-spacing-36: 36px;
--line-spacing-40: 40px;
--line-spacing-46: 46px;
--line-spacing-48: 48px;
--line-spacing-50: 50px;
}
/* Font's Step One */
.font-sans-200{
    font-family: source-han-sans-japanese;
    font-weight: 200;
    font-style: normal;
}
.font-sans-300{
    font-family: source-han-sans-japanese;
    font-weight: 300;
    font-style: normal;
}
.font-sans-normal-300{
    font-family: source-han-sans-japanese;
    font-weight: 300;
    font-style: normal;
}
.font-sans-400{
    font-family: source-han-sans-japanese;
    font-weight: 400;
    font-style: normal;
}
.font-sans-500{
    font-family: source-han-sans-japanese;
    font-weight: 500;
    font-style: normal;
}
.font-sans-700{
    font-family: source-han-sans-japanese, sans-serif;
    font-weight: 700;
    font-style: normal;
}
.font-sans-900{
    font-family: source-han-sans-japanese;
    font-weight: 900;
    font-style: normal;
}

/* Font's Step Two */
.font-code-300{
    font-family: SourceHanCodeJP-Bold;
    font-weight: 300;
    font-style: normal;
}
.font-code-400{
    font-family: SourceHanCodeJP-Bold;
    font-weight: 400;
    font-style: normal;
}
.font-code-500{
    font-family: SourceHanCodeJP-Bold;
    font-weight: 500;
    font-style: normal;
}
.font-code-600{
    font-family: SourceHanCodeJP-Bold;
    font-weight: 600;
    font-style: normal;
}
.font-code-700{
    font-family: SourceHanCodeJP-Bold;
    font-weight: 700;
    font-style: normal;
}
.font-code-800{
    font-family: SourceHanCodeJP-Bold;
    font-weight: 800;
    font-style: normal;
}
.font-code-900{
    font-family: SourceHanCodeJP-Bold;
    font-weight: 900;
    font-style: normal;
}
.tab_design ul li {
    display: inline-block;
    width: 100%;
    text-align: center;
	position: relative;
    top: 1px;
}
.tab_design ul {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 5px 1fr 5px 1fr 5px 1fr 5px 1fr 5px 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-gap: 5px;
}
.tab_design {
    border-bottom: 1px solid rgba(45,45,45,.07);
}
.tab_design ul li a {
    margin-right: 0px;
    padding: 10px 0 9px 0;
    font-size: 16px;
    color: #B4B4B4;
    font-weight: 600;
    line-height: 36px;
    border-radius: 4px 4px 0 0;
    display: block;
    background: #f8f8f8;
}
.tab_design ul li a.active {
    background: transparent;
    border: 1px solid #dee2e6;
    border-bottom: transparent;
}
section.tab {
    padding-top: 30px;
}
.search_form_result [type=search] {
    display: block;
    width: 100%;
    border: 1px solid #d2d2d2;
    border-radius: 50px;
    padding: 10px;
}

.search_form_result {
    position: relative;
    margin-bottom: 46px;
}

.search_form_result [type=submit] {
    position: absolute;
    top: 9px;
    right: 12.74px;
    background: transparent;
    border: none;
    color : #d2d2d2;
}
.search_form_result ::-webkit-input-placeholder {
  color: #d2d2d2;
  font-weight: 600;
}
.search_form_result ::-moz-placeholder {
  color: #d2d2d2;
  font-weight: 600;
}
.search_form_result :-ms-input-placeholder {
  color: #d2d2d2;
  font-weight: 600;
}
.search_form_result ::-ms-input-placeholder {
  color: #d2d2d2;
  font-weight: 600;
}
.search_form_result ::placeholder {
  color: #d2d2d2;
  font-weight: 600;
}
/* clears the 'X' from Internet Explorer */
input[type=search]::-ms-clear {  display: none; width : 0; height: 0; }
input[type=search]::-ms-reveal {  display: none; width : 0; height: 0; }

/* clears the 'X' from Chrome */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none; }
.shadow button.btn.btn-primary.mb-2 {
    width: 100%;
    margin: 0 auto;
    display: block;
    margin-top: 20px;
    text-transform: uppercase;
    background: #0074AA;
}