:root { --default-fontSize: 12px; --h1-size: 2.5rem; --h2-size: 2rem; --h3-size: 1.75rem; --h4-size: 1.5rem; --h5-size: 1.25rem; --h6-size: 1rem; --h7-size: 0.75rem; --h8-size: 0.5rem; --h9-size: 0.25rem; --base-line-height: 1.4; --space: 10px; --space-S: calc( var(--space)/2 ); --space-L: calc( var(--space)*1.5 ); --space-XL: calc( var(--space)*2 ); --space-XXL: calc( var(--space)*4 ); --fixed-space: 16px; --fixed-space-S: calc( var(--fixed-space)/2 ); --fixed-space-L: calc( var(--fixed-space)*1.5 ); --fixed-space-XL: calc( var(--fixed-space)*2 ); --border-px: 1px; --border-color: var(--sub-color); --border-radius: 4px; --circle-size: 50px; --hr-color: var(--sub-color); --hr-mrgn-l: 0; --hr-mrgn-t: var(--space-L); --hr-mrgn-r: 0; --hr-mrgn-b: var(--space-L); --colomn-count: 1; --shadow-x: $shadow-x; --shadow-y: $shadow-y; --shadow-z: $shadow-z; --shadow-blur: $shadow-blur; --shadow-color: $shadow-color; --pager-w:1rem; --pager-h:1rem; }

*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-overflow-scrolling: touch; }

html, body, h1, h2, h3, h4, _ul, _ol, _dl, _li, dt, dd, p, div, span, img, a, table, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: normal; font-size: 100%; vertical-align: baseline; line-height: 1.4; letter-spacing: 0.05rem; word-wrap: break-word; }

.row { margin: 0; }

[class^="col"] { padding: 0; }

@font-face { font-family: 'KozGoPro-M'; src: url("/font/KozGoPro-Medium.otf") format("otf"); }

@font-face { font-family: 'KozGoPro-R'; src: url("/font/KozGoPro-Regular.otf") format("otf"); }

@font-face { font-family: 'KozMin6-R'; src: url("/font/KozMinPr6N-Regular.otf") format("otf"); }

@font-face { font-family: 'KozMin-R'; src: url("/font/KozMinPro-Regular.otf") format("otf"); }

@font-face { font-family: 'Sawarabi-Mincho'; src: url("/font/Sawarabi-Mincho.woff2") format("woff2"); }

.wf-Min { font-family: "Sawarabi Mincho"; }

.f-Gos { font-family: "KozGoPro-R"; }

html { width: 100%; }

body { position: relative; width: 100%; margin-bottom: 40px; font-size: var(--default-fontSize); font-family: "Sawarabi Mincho", serif, "KozGoPro-R", "KozMin-R", 'Meiryo', "Osaka"; background-color: #fff; color: #3a362b; z-index: 0; }

h1, .h1 { font-size: 2.5rem; line-height: 2.5rem; }

h2, .h2 { font-size: 2rem; line-height: 2rem; }

h3, .h3 { font-size: 1.75rem; line-height: 1.75rem; }

h4, .h4 { font-size: 1.5rem; line-height: 1.5rem; }

h5, .h5 { font-size: 1.25rem; line-height: 1.25rem; }

h6, .h6 { font-size: 1rem; line-height: 1rem; }

.h7 { font-size: 0.75rem; line-height: 0.75rem; margin: 0; }

.h8 { font-size: 0.5rem; line-height: 0.5rem; margin: 0; }

.h9 { font-size: 0.25rem; line-height: 0.25rem; margin: 0; }

h1, h2, h3, h4, h5, h6 { font-weight: 600; margin: 0; padding-top: 1rem; padding-bottom: 1rem; }

.h1, .h2, .h3, .h4, .h5, .h6, .h7, .h8, .h9 { font-weight: 100; padding: 0; margin: 0; }

p { margin-bottom: 0.1rem; font-size: var(--default-fontSize); }

.ul { list-style-type: none; padding: 0; }

.li { list-style-type: none; }

.__img { width: 100%; height: auto; -webkit-filter: grayscale(50%); filter: grayscale(50%); }

.l_justify-left { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }

.l_justify-center { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.l_justify-right { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; }

.l_direction-column { display: -webkit-box; display: -ms-flexbox; display: flex; box-direction: column; }

.l_allCenter { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.l_allCenter .l_allCenter-child { display: block; }

.l_wrapper-maxWidth { width: 1000px; }

.l_overflow-hidden { overflow: hidden; }

.l_overflow-scroll { overflow: scroll; }

.l_overflow-x { overflow-x: scroll; }

.l_stiky { position: -webkit-sticky; position: sticky; top: 0; }

.l_fixed { position: fixed; }

.l_relative { position: relative; }

.l_absolute { position: absolute; }

.l_top-0 { top: 0; }

.l_bottom-0 { bottom: 0; }

.l_left-0 { left: 0; }

.l_right-0 { right: 0; }

.l_zindex--10 { z-index: -10; }

.l_zindex-0 { z-index: 0; }

.l_zindex-100 { z-index: 100; }

.l_zindex-200 { z-index: 200; }

.l_zindex-300 { z-index: 300; }

.l_zindex-400 { z-index: 400; }

.l_zindex-500 { z-index: 500; }

.l_zindex-600 { z-index: 600; }

.l_zindex-700 { z-index: 700; }

.l_zindex-800 { z-index: 800; }

.l_zindex-900 { z-index: 900; }

.l_zindex-1000 { z-index: 1000; }

.l_text-center { text-align: center !important; }

.l_text-left { text-align: left !important; }

.l_text-right { text-align: right !important; }

.l_wordbreak-all { word-break: break-all !important; }

.l_text-just { text-align: justify; text-align-last: left; text-justify: inter-ideograph; }

.l_text-just-single { text-align: justify; text-align-last: justify; text-justify: inter-ideograph; }

.l_float-left { float: left; }

.l_float-right { float: right; }

.l_float-box { height: calc( ((var(--default-fontSize) * var(--base-line-height)) * 4) - (var(--default-fontSize)/2)); width: calc( ((var(--default-fontSize) * var(--base-line-height)) * 4) - (var(--default-fontSize)/2)); margin: 0 0.8rem 0 0; }

.l_display-sp { display: block; }

.l_display-tb { display: none; }

.l_display-pc { display: none; }

.l_block { display: block; }

.l_inline-block { display: inline-block; }

.l_inline { display: inline; }

.l_none { display: none; }

.l_tablecell { display: table-cell; }

.l_vartical-top { vertical-align: top; }

.l_vartical-middle { vertical-align: middle; }

.l_vartical-bottom { vertical-align: bottom; }

.l_bg-img-cover { background-position: center; background-size: cover; background-repeat: no-repeat; }

.l_bg-img-fixed { background-position: center; background-attachment: fixed; background-repeat: no-repeat; }

.l_aspect-wrapper { position: relative; width: 100%; }

.l_aspect-wrapper::before { content: ""; display: block; padding-top: calc( 100% * ( 9/16 )); }

.l_asp { position: absolute; top: 0; left: 0; bottom: 0; right: 0; }

.l_btnLink { position: relative; z-index: 0; }

.l_btnLink a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; }

.o_wrapper { max-width: 1000px; width: 100%; margin: auto; }

.o_hr { border-top: var(--border-px) solid #c5c3b3; background-color: inherit !important; }

.o_hover-boxShadow:hover { -webkit-box-shadow: 4px 4px 6px 3px rgba(0, 0, 0, 0.2); box-shadow: 4px 4px 6px 3px rgba(0, 0, 0, 0.2); }

.o_hover-boxShadow-none:hover { -webkit-box-shadow: none; box-shadow: none; }

.o_hover-boxShadow-none:hover * { -webkit-box-shadow: none; box-shadow: none; }

.o_hover-bgColor:hover { background-color: #3a362b; }

.o_hover-bgColor:hover * { color: #f8f6e7; }

.o_hover-animation { -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; }

.o_grid-top { display: -ms-grid; display: grid; -ms-grid-columns: auto; grid-template-columns: auto; grid-auto-columns: 1fr; grid-template-areas: "header" "menu" "hero" "main" "side" "footer"; }

.o_grid-top .o_header { -ms-grid-row: 1; -ms-grid-column: 1; grid-area: header; }

.o_grid-top .o_menu { -ms-grid-row: 2; -ms-grid-column: 1; grid-area: menu; }

.o_grid-top .o_hero { -ms-grid-row: 3; -ms-grid-column: 1; grid-area: hero; }

.o_grid-top .o_vartical-line { grid-area: vartical-line; }

.o_grid-top .o_main { -ms-grid-row: 4; -ms-grid-column: 1; grid-area: main; }

.o_grid-top .o_side { -ms-grid-row: 5; -ms-grid-column: 1; grid-area: side; width: auto; }

.o_grid-top .o_footer { -ms-grid-row: 6; -ms-grid-column: 1; grid-area: footer; }

.o_grid-hero { display: -ms-grid; display: grid; -ms-grid-columns: 1fr; grid-template-columns: 1fr; -ms-grid-rows: auto; grid-template-rows: auto; grid-template-areas: "hero-center"; }

.o_grid-hero .o_hero-center { -ms-grid-row: 1; -ms-grid-column: 1; grid-area: hero-center; min-height: 400px; }

.o_grid-hero .o_hero-left { grid-area: hero-left; display: none; }

.o_grid-hero .o_hero-right { grid-area: hero-right; display: none; }

.o_grid-main { display: -ms-grid; display: grid; -ms-grid-columns: 1fr 1fr; grid-template-columns: 1fr 1fr; -ms-grid-rows: auto; grid-template-rows: auto; grid-auto-columns: 1fr; grid-auto-rows: auto; padding: var(--space); }

.o_grid-main > div:nth-of-type(1) { -ms-grid-column-span: 2; grid-column: span 2; -ms-grid-row-span: 1; grid-row: span 1; }

.o_side-post { display: -ms-grid; display: grid; -ms-grid-columns: 50% auto; grid-template-columns: 50% auto; -ms-grid-rows: auto auto; grid-template-rows: auto auto; grid-template-areas: "side-post-image side-post-title" "side-post-image side-post-text"; }

.o_side-post .o_side-post-image { -ms-grid-row: 1; -ms-grid-row-span: 2; -ms-grid-column: 1; grid-area: side-post-image; }

.o_side-post .o_side-post-title { -ms-grid-row: 1; -ms-grid-column: 2; grid-area: side-post-title; }

.o_side-post .o_side-post-text { -ms-grid-row: 2; -ms-grid-column: 2; grid-area: side-post-text; }

.o_post-title { grid-area: post-title; }

.o_post-img { grid-area: post-img; }

.o_post-text { grid-area: post-text; }

.o_white-bg-mask { background-color: rgba(255, 255, 255, 0.1); border: 1px solid rgba(0, 0, 0, 0.1); }

.u_bread-top { top: calc( 1.5rem + 10px*2); }

.u_line-height-S { line-height: 0.8rem; }

.u_line-height { line-height: 1rem; }

.u_line-height-M { line-height: 1.2rem; }

.u_line-height-L { line-height: 1.5rem; }

.u_box-S { padding: calc( 10px /2); }

.u_box { padding: 10px; }

.u_box-L { padding: calc( 10px *1.5); }

.u_box-XL { padding: calc( 10px *2); }

.u_bg-mainColor { background-color: #fff; }

.u_bg-baseColor { background-color: #f8f6e7; }

.u_bg-subColor { background-color: #3a362b; }

.u_font-mainColor { color: #fff; }

.u_font-baseColor { color: #f8f6e7; }

.u_font-subColor { color: #3a362b; }

.u_w-auto { width: auto; }

.u_w-0 { width: 0; }

.u_w-25 { width: 25%; }

.u_w-50 { width: 50%; }

.u_w-75 { width: 75%; }

.u_w-100 { width: 100%; }

.u_h-0 { height: 0; }

.u_h-300px { height: 300px; }

.u_h-100 { height: 100%; }

.u_h-100vh { height: 100vh; }

.u_p-0 { padding: 0; }

.u_p-0-b { padding-bottom: 0; }

.u_p-0-t { padding-top: 0; }

.u_p-0-l { padding-left: 0; }

.u_p-0-r { padding-right: 0; }

.u_p-t-sm { padding-top: calc( 10px /2); }

.u_p-b-sm { padding-bottom: calc( 10px /2); }

.u_p-l-sm { padding-left: calc( 10px /2); }

.u_p-r-sm { padding-right: calc( 10px /2); }

.u_p-t { padding-top: 10px; }

.u_p-b { padding-bottom: 10px; }

.u_p-l { padding-left: 10px; }

.u_p-r { padding-right: 10px; }

.u_m-auto { margin: auto; }

.u_m-0 { margin: 0; }

.u_m-0-t { margin-top: 0; }

.u_m-0-b { margin-bottom: 0; }

.u_m-0-left { margin-left: 0; }

.u_m-0-right { margin-right: 0; }

.u_m-sm { margin: calc( 10px /2); }

.u_m { margin: 10px; }

.u_m-t-sm { margin-top: calc( 10px /2); }

.u_m-b-sm { margin-bottom: calc( 10px /2); }

.u_m-l-sm { margin-left: calc( 10px /2); }

.u_m-r-sm { margin-right: calc( 10px /2); }

.u_m-t { margin-top: 10px; }

.u_m-b { margin-bottom: 10px; }

.u_m-l { margin-left: 10px; }

.u_m-r { margin-right: 10px; }

.u_m-t-L { margin-top: calc( 10px *1.5); }

.u_m-b-L { margin-bottom: calc( 10px *1.5); }

.u_m-l-L { margin-left: calc( 10px *1.5); }

.u_m-r-L { margin-right: calc( 10px *1.5); }

.u_m-t-XL { margin-top: calc( 10px *2); }

.u_m-b-XL { margin-bottom: calc( 10px *2); }

.u_m-l-XL { margin-left: calc( 10px *2); }

.u_m-r-XL { margin-right: calc( 10px *2); }

.u_m-l-XXL { margin-left: calc( 10px *4); }

.u_m-r-XXL { margin-right: calc( 10px *4); }

.u_z-0 { z-index: 0; }

.u_z-low { z-index: 100; }

.u_z-mid { z-index: 200; }

.u_z-high { z-index: 300; }

.u_z-max { z-index: 1000; }

.u_bold { font-weight: bold; }

.u_boxShadow { -webkit-box-shadow: 4px 4px 6px 3px rgba(0, 0, 0, 0.2); box-shadow: 4px 4px 6px 3px rgba(0, 0, 0, 0.2); }

.u_boxShadow-1 { -webkit-box-shadow: 1px 2px 2px 1px rgba(0, 0, 0, 0.2); box-shadow: 1px 2px 2px 1px rgba(0, 0, 0, 0.2); }

.u_boxShadow-none { -webkit-box-shadow: none; box-shadow: none; }

.u_dropShadow { -webkit-filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.5)); filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.5)); }

.u_textShadow-none { text-shadow: none !important; }

.u_border { border: 1px solid #c5c3b3; }

.u_border-double { border-style: double; }

.u_border-color-up { border-color: #3a362b !important; }

.u_border-white-op-01 { border-color: rgba(255, 255, 255, 0.1) !important; }

.u_border-black-op-01 { border-color: rgba(0, 0, 0, 0.1) !important; }

.u_border-2px { border-width: 2px !important; }

.u_border-3px { border-width: 3px !important; }

.u_border-left { border-left: var(--border-px) solid #c5c3b3; }

.u_border-right { border-right: var(--border-px) solid #c5c3b3; }

.u_border-top { border-top: var(--border-px) solid #c5c3b3; }

.u_border-bottom { border-bottom: var(--border-px) solid #c5c3b3; }

.u_border-tb { border-top: 1px solid #c5c3b3; border-bottom: 1px solid #c5c3b3; }

.u_border-lr { border-left: 1px solid #c5c3b3; border-right: 1px solid #c5c3b3; }

.u_border-none { border: initial; }

.u_radius { border-radius: var(--border-radius); }

.u_circle { border-radius: 50%; }

.u_circle-size-S { width: 50px; height: 50px; }

.u_circle-size-M { min-width: var(--circle-size); min-height: var(--circle-size); }

.tab-wrap { margin: 0 auto; }

.tab-wrap label { margin: 0; }

.tab-wrap ul.tabs { width: 100%; margin: 0 auto; list-style: none; overflow: hidden; padding: 0; }

.tab-wrap ul.tabs li { float: left; width: calc(100%/2); }

.tab-wrap ul.tabs li a label { position: relative; display: block; margin-top: 40px; padding: 10px 0 0 0; font-family: 'Open Sans', sans-serif; font-size: 18px; text-align: center; text-decoration: none; color: #3a362b; background: #e0dbc5; -webkit-transition: padding 0.2s ease, margin 0.2s ease; -o-transition: padding 0.2s ease, margin 0.2s ease; transition: padding 0.2s ease, margin 0.2s ease; border-top-left-radius: 8px; border-top-right-radius: 8px; }

.tab-wrap ul.tabs li a label:not(.active) { border-bottom: 1px solid #c5c3b3; }

.tab-wrap .tabs li:first-child a label { z-index: 3; -webkit-box-shadow: 2px 8px 25px -2px rgba(0, 0, 0, 0.3); box-shadow: 2px 8px 25px -2px rgba(0, 0, 0, 0.3); border-top-left-radius: 8px; border-top-right-radius: 8px; }

.tab-wrap .tabs li:last-child a label { z-index: 1; -webkit-box-shadow: 2px 8px 25px -2px rgba(0, 0, 0, 0.3); box-shadow: 2px 8px 25px -2px rgba(0, 0, 0, 0.3); border-top-right-radius: 8px; border-top-left-radius: 8px; }

.tab-wrap ul.tabs li a label:hover:not(.active) { margin: 35px 0 0 0; padding: 10px 0 5px 0; }

.tab-wrap ul.tabs li a label.active { margin: 30px 0 0 0; padding: 10px 0 10px 0; background: #f8f6e7; color: #3a362b; /*color: #ff6831;*/ z-index: 4; outline: none; }

.tab-wrap .group:before, .tab-wrap .group:after { content: " "; /* 1 */ display: table; /* 2 */ }

.tab-wrap .group:after { clear: both; }

.tab-wrap #tabContent { width: 100%; height: auto; margin: 0 auto; background: #f8f6e7; border: 1px solid #c5c3b3; border-top: none; -webkit-box-shadow: 2px 8px 25px -2px rgba(0, 0, 0, 0.3); box-shadow: 2px 8px 25px -2px rgba(0, 0, 0, 0.3); border-bottom-right-radius: 8px; border-bottom-left-radius: 8px; }

.tab-wrap .active { border: 1px solid #c5c3b3; border-bottom: none; }

#tab-sync1, #tab-sync2, .example1, .example2, #two { display: none; }

#tab-sync1:checked ~ .tab-wrap #one, #tab-sync2:checked ~ .tab-wrap #two { display: block; }

#tab-sync1:checked ~ .tab-wrap #a1, #tab-sync2:checked ~ .tab-wrap #a2 { color: red; }

#tab-sync1:checked ~ .example1, #tab-sync2:checked ~ .example2 { display: block; }

.tabs li a:hover { text-decoration: none; }

header { padding: 20px 0; background-color: #fff; }

.catchCopy p { font-size: 32px; letter-spacing: 8px; }

.tabs .name { font-size: 12px; letter-spacing: 0.3rem; }

.tabs .point { font-size: 24px; letter-spacing: 0.3rem; }

.point-btn { margin: 40px 40px 20px; width: 100%; height: 60px; line-height: 60px; letter-spacing: 8px; text-align: center; font-size: 18px; font-weight: bold; color: #fff; background-color: #765c2f; -webkit-box-shadow: 4px 4px 3px rgba(118, 92, 47, 0.5); box-shadow: 4px 4px 3px rgba(118, 92, 47, 0.5); border-radius: 4px; -webkit-transition: .4s; -o-transition: .4s; transition: .4s; }

.point-btn:hover { -webkit-box-shadow: 4px 4px 3px rgba(209, 199, 123, 0.5); box-shadow: 4px 4px 3px rgba(209, 199, 123, 0.5); background-color: #d1c77b; }

.catalog-btn { height: 60px; line-height: 60px; letter-spacing: 8px; text-align: center; font-size: 18px; font-weight: bold; color: #857dab; border: 1px solid #857dab; border-radius: 4px; -webkit-transition: .4s; -o-transition: .4s; transition: .4s; }

.catalog-btn:hover { -webkit-box-shadow: 4px 4px 3px rgba(0, 0, 0, 0.3); box-shadow: 4px 4px 3px rgba(0, 0, 0, 0.3); color: #fff; background-color: #857dab; }

hr { border-top-width: 3px; margin-top: 0; margin-bottom: 0; }

.content-layout { padding: 40px; }

.content-layout img { width: 100%; }

.content-layout .caption h2 { font-size: 38px; letter-spacing: 3px; line-height: initial; text-shadow: 4px 4px 3px rgba(0, 0, 0, 0.2); }

.content-layout .caution span { color: rgba(0, 0, 0, 0.5); font-size: 14px; letter-spacing: 0px; }

.content-layout .sub-img img { display: block; margin: auto; }

.content-layout .main-img { margin-bottom: 30px; }

.content-layout .main-title > * { font-size: 22px; line-height: initial; letter-spacing: 0px; }

.content-layout .main-subTitle > * { font-size: 14px; line-height: initial; letter-spacing: 0px; }

.content-layout .main-name1 p { font-size: 12px; line-height: 12px; }

.content-layout .main-name2 { font-size: 12px; line-height: 12px; }

.content-layout .main-num .num-icon { font-size: 8px; }

.content-layout .main-num .num-text { font-size: 12px; letter-spacing: 0px; }

.content-layout .main-sentence { display: none; font-size: 8px; line-height: 12px; letter-spacing: 1px; }

.content-layout .num { margin: 8px 0; padding: 2px 0; font-weight: bold; }

.content-layout .num-icon { font-size: 8px; color: rgba(0, 0, 0, 0.8); background-color: rgba(118, 92, 47, 0.1); border-radius: 2px; }

.content-layout .num-text { font-size: 12px; letter-spacing: -0.5px; }

.content-layout .sub-area .col.sub1 .u_box { padding: 0; padding-bottom: 10px; }

.content-layout .sub-area .col.sub2 .u_box { padding: 0; padding-bottom: 10px; }

.content-layout .sub-area .col.sub3 .u_box { padding: 0; padding-bottom: 10px; }

.content-layout .sub-title { margin-bottom: 10px; }

.content-layout .sub-title > * { font-size: 16px; line-height: calc(16px + (16px * 0.2)); letter-spacing: 0px; }

.content-layout .sub-subTitle > * { font-size: 12px; line-height: calc(12px + (12px * 0.2)); letter-spacing: 0px; }

.content-layout .sub-name1 p { font-size: 12px; line-height: calc(12px + (12px * 0.5)); letter-spacing: 0px; }

.content-layout .sub-name2 { font-size: 12px; line-height: calc(12px + (12px * 0.5)); letter-spacing: 0px; }

.content-layout .sub-sentence { display: none; font-size: 8px; line-height: calc(8px + 4px); letter-spacing: 1px; }

.content-layout .sub-grid-wrap { display: -ms-grid; display: grid; -webkit-column-gap: 10px; column-gap: 10px; -ms-grid-columns: 1fr 10px 1fr 10px 0; grid-template-columns: 1fr 1fr 0; grid-template-areas: "sub1-img sub2-img sub3-img" "sub1-title sub2-title sub3-title" "sub1-name sub2-name sub3-name" "sub1-num sub2-num sub3-num" "sub1-sentence sub2-sentence sub3-sentence"; }

.content-layout .sub-grid-wrap .sub1-img { -ms-grid-row: 1; -ms-grid-column: 1; grid-area: sub1-img; }

.content-layout .sub-grid-wrap .sub2-img { -ms-grid-row: 1; -ms-grid-column: 3; grid-area: sub2-img; }

.content-layout .sub-grid-wrap .sub3-img { -ms-grid-row: 1; -ms-grid-column: 5; grid-area: sub3-img; }

.content-layout .sub-grid-wrap .sub1-title { -ms-grid-row: 2; -ms-grid-column: 1; grid-area: sub1-title; }

.content-layout .sub-grid-wrap .sub2-title { -ms-grid-row: 2; -ms-grid-column: 3; grid-area: sub2-title; }

.content-layout .sub-grid-wrap .sub3-title { -ms-grid-row: 2; -ms-grid-column: 5; grid-area: sub3-title; }

.content-layout .sub-grid-wrap .sub1-name { -ms-grid-row: 3; -ms-grid-column: 1; grid-area: sub1-name; position: relative; }

.content-layout .sub-grid-wrap .sub2-name { -ms-grid-row: 3; -ms-grid-column: 3; grid-area: sub2-name; position: relative; }

.content-layout .sub-grid-wrap .sub3-name { -ms-grid-row: 3; -ms-grid-column: 5; grid-area: sub3-name; position: relative; }

.content-layout .sub-grid-wrap .sub1-num { -ms-grid-row: 4; -ms-grid-column: 1; grid-area: sub1-num; }

.content-layout .sub-grid-wrap .sub2-num { -ms-grid-row: 4; -ms-grid-column: 3; grid-area: sub2-num; }

.content-layout .sub-grid-wrap .sub3-num { -ms-grid-row: 4; -ms-grid-column: 5; grid-area: sub3-num; }

.content-layout .sub-grid-wrap .sub1-sentence { -ms-grid-row: 5; -ms-grid-column: 1; grid-area: sub1-sentence; }

.content-layout .sub-grid-wrap .sub2-sentence { -ms-grid-row: 5; -ms-grid-column: 3; grid-area: sub2-sentence; }

.content-layout .sub-grid-wrap .sub3-sentence { -ms-grid-row: 5; -ms-grid-column: 5; grid-area: sub3-sentence; }

.footer_content { padding: 40px; color: #fff; background-color: #332814; }

.footer_content .title { margin-bottom: 20px; }

.footer_content .titleText .h7 { font-size: 16px; letter-spacing: 8px; line-height: initial; }

.footer_content .titleText .h2 { font-size: 32px; letter-spacing: 8px; line-height: initial; }

.footer_content hr { margin: 8px 0; border-color: white; }

.footer_content .catalogImg { width: 250px; height: 250px; }

.footer_content .cource-title .h1 { font-size: 36px; letter-spacing: 8px; line-height: initial; }

.footer_content .cource-title .h5 { font-size: 24px; letter-spacing: 4px; line-height: initial; }

.footer_content .cource-title .h7 { font-size: 16px; letter-spacing: 2px; line-height: initial; }

.footer_content .cource-subTitle .h6 { font-size: 18px; line-height: initial; }

.footer_content .cource-subTitle .h7 { font-size: 14px; line-height: initial; }

.footer_content .point-btn { width: auto; margin: 0; -webkit-box-shadow: 4px 4px 3px rgba(0, 0, 0, 0.3); box-shadow: 4px 4px 3px rgba(0, 0, 0, 0.3); }
