@charset "utf-8";
/* CSS Document */
body {
	background: #fff; 
    font: 16px/1.8  "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;  
  	color: #222222;
    font-size: 16px;
   	line-height: 1.8;
  	letter-spacing: 0.08em; 
}
		
@media only screen and (max-width: 767px) {
body {
  	font-size: 14px;
  
}
  
header {
	font-size: 16px;		
}
}	
			
h2, h3, h4 {
	font-weight: bold;
} 		

p, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd {
  	margin: 0;
  	padding: 0;
}

img {
  	max-width: 100%;
  	height: auto;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
      
/* Transition elsements */
a,
button {
    -webkit-transition: all 0.2s ease-in-out 0.125s;
    -moz-transition: all 0.2s ease-in-out 0.125s;
    -o-transition: all 0.2s ease-in-out 0.125s;
    -ms-transition: all 0.2s ease-in-out 0.125s;
    transition: all 0.2s ease-in-out 0.125s;
}

a:hover {
 	text-decoration: none;
}

/* Sections */
.module,
.module-large,
.module-small,
.module-smallest {
  	position: relative;
  	padding: 50px 0;
  	background-repeat: no-repeat;
  	background-position: 50% 50%;
  	background-size: cover;
}

.module-large {
  	padding: 75px 0;
}

.module-small {
  	padding: 25px 0;
}
  
.module-smallest {
  	padding: 0 ;
}

@media only screen and (max-width: 767px) {
.module-large {
    padding: 50px 0;
}
}

a:hover, a:focus, button:focus {
	text-decoration: none;
	outline: 0;
}

/*--------------------------------------------------------------
            共通css調整
--------------------------------------------------------------*/			
a.cv_btn_header {
    background-color: #f0ac2f;
	font-weight: normal;
}
	
a:hover.cv_btn_header {
	color: #fff;
}	
	
.drawer-dropdown-menu.service-menu > li ul li a,
.drawer-dropdown .drawer-arrow {
   box-sizing: initial; 
}

.drawer-navbar a:hover {
    color: #fff;
}
		
@media screen and (min-width: 64em) {
.drawer-menu-item {
	padding-right: 2em;
	padding-left: 2em;
}
	
.drawer-dropdown-menu.service-menu > li ul li a {
	letter-spacing: 0.02em;
}
	
.drawer-dropdown.open a:hover {
    color: #333 !important;	
}
}
	
#breadcrumbs ol {
    line-height: 1.28;
}	
	
#breadcrumbs li img {
    vertical-align: baseline !important ;
}

#breadcrumbs.white ol li,
#breadcrumbs.white ol li a {
	color: #fff;
}	
		
#btn_Pagetop {
	bottom: 165px;
	z-index: 100 ;			
}	
	
@media screen and (min-width: 64em){	
footer {
    padding-bottom: 3em;
}
}
	
/*--------------------------------------------------------------
            text/color
--------------------------------------------------------------*/		
.module-large h2 {
    color: #222;
    font-size: 36px;
	font-weight: 400;
    line-height: 1.4;
    position: relative;
	margin-bottom: 80px;
}	
		
.module-large h2::after {
    content: '';
    width: 70px;
    height: 3px;
    background-color: #075877;
    position: absolute;
    bottom: -20px;
    left: calc(50% - 35px);
}	
		
@media only screen and (max-width: 767px) {
.module-large h2 {
	font-size: 26px;
	margin-bottom: 50px;		
}
}

h3 {
 	 color: #222;
}
  
.text_em {
	font-size: 26px;
    line-height: 1.6;
} 
	
.text_em .small {
	font-size: 0.6em;
} 
	
@media only screen and (max-width: 767px) {
.text_em {
	font-size: 20px;
} 
}
	
.color_theme {
	color: #075877;
}
		
.color_em {
	color: #fdab14;
}
		
.bgcolor_second {
	background-color: #f0f4f7;
}
		
.yellow_mark {
	 background:linear-gradient(transparent 60%, #ff6 60%);
} 
	
/*--------------------------------------------------------------
            button
--------------------------------------------------------------*/						
.btn-cv {
	display: inline-block;
	width: 100%;
    padding: 14px 0 12px;
    border: 1px solid #f0ac2f;
    border-radius: 8px;
    color: #ffffff;
    font-size: 18px;
    letter-spacing: 0.1em;
    background: #f0ac2f;
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
}
	
.btn-cv:hover {
	background: #ffffff;
	color: #f0ac2f;
	-webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
} 	
	
@media only screen and (max-width: 767px) {
.btn-cv {
	display: block;
	width: 100%;
}
}
	
/*--------------------------------------------------------------
	Header
--------------------------------------------------------------*/
#header {
	background-image: url(/web/jp/trade/images/sht_top8.jpg); 
	background-color: #1f4974;
	background-position: center center; 
	background-repeat: no-repeat;
}
	
#header .text-wrap {
	display: table;
	position: relative;
	width: 90%;
	text-align: center;
	z-index: 4;
	height: 520px;
}
	
#header .container {
	max-width: none;
}
	
@media only screen and (min-width: 64em) {
#header {
	margin-top: 3em;
}

#header .text-wrap {
    max-width: 64em; 
	text-align: left;
}
}
	
#header .text-inner {
	display: table-cell;
	vertical-align: middle;
	padding: 90px 0 50px;
} 
	
#header h6 {
	color: #fff;
	font-size: 20px;
    font-weight: 700; 
	line-height: 1.6;
}
	
#header .logo figure {
	position: relative;
	top: 0px;
}	
	
#header .logo img {
	width: 550px;
}

#header .sub_title {
    color: #fff;
    font-size: 30px;
    font-weight: bold;
    line-height: 1.6;
}
	
@media only screen and (max-width: 767px) {	
#header h6 {
	font-size: 15px;
}
	
#header .logo img {
	width: 280px;
}
	
#header .sub_title {
    font-size: 26px;
}
}

/*--------------------------------------------------------------
	 Section info
--------------------------------------------------------------*/		
#info .info_wrap {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: row;
  	flex-direction: row;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-align: center;
	align-items: center;
    line-height: 1.6;
}
		
.info_wrap .info_label {
	width: 100px;
    margin-right: 0.5em;
	padding: 0.2em 0.6em 0.1em;
    border: 1px solid #ED0206;
    color: #ED0206;
	font-size: 0.85em;
	letter-spacing: 0;
    text-align: center;
}
		
.info_wrap .info_label.end {
    border-color: #222222;
    color: #222222;
}

.info_wrap .info_date {
	margin-right: 0.5em;
	font-size: 0.8em;
	color: #999;
}
		
.info_wrap a {
	color: inherit;
}	
		
.info_wrap a:hover {
	text-decoration: underline;
}	
	
@media only screen and (max-width: 767px) {
#info .info_wrap {
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-ms-flex-align: start;
	align-items: flex-start;
	text-align: left;
}
	
.info_wrap .info_label {
    margin-right: 0;
	margin-bottom: .25em;
}
}

/*--------------------------------------------------------------
	section lead
--------------------------------------------------------------*/
/* Section Video */ 
.video_box {
	height: 100% ;
	background-color: #fff;
	border: 1px solid #2d67a3;  
	padding: 12px;
	border-radius: 4px;
}
	
@media (max-width: 767px) {
.video_box {
	padding: 7px;
}
}	

.video_wrap {
     position: relative;
     padding-bottom: 56.25%; 
     height: 0;
     overflow: hidden;
}
 
.video_wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

/*--------------------------------------------------------------
	section problem
--------------------------------------------------------------*/ 	
#problem {
    background-image: url(/web/jp/trade/images/sht02.jpg);
    /*height: 650px; */
}
	
#problem h2 {
	margin-bottom: 10px;
}	
	
#problem h2:after {
	content: none;
}

#problem p {
    margin-top: 20px;
}
	
.after-about {
    position: relative;
    margin: 30px 0 0 0;
    padding: 10px;
    text-align: left;
}
	
.after-about .list-items {
    display: -ms-flexbox;
    display: flex;
    margin: -5px -5px -5px -5px;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: stretch;
    align-items: stretch;
   	padding: 0;
    flex-flow: row wrap;
}

@media screen and (min-width: 64em) {
.after-about .list-item.is-1of2 {
    width: 50%;
}
}

.after-about .list-item {
    width: 100%;
    padding: 5px 5px 5px 5px;
}

.after-about .item-wrap {
    display: -ms-flexbox;
    display: flex;
    position: relative;
    width: 100%;
    height: 100%;
    background-color: #FFFFFF;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    box-shadow: 0 0 30px rgb(0 0 0 / 10%);
    border-radius: 8px;
}

.after-about .item-icon {
    width: 102px;
    height: 102px;
}
.after-about .item-text {
    margin: 20px;
    font-size: 18px;
	line-height: 1.8;
    -ms-flex: 1;
    flex: 1;
}
	
.sec-after .after-about .list-item {
    width: 100%;
    padding: 5px 5px 5px 5px;
}
	
/*--------------------------------------------------------------
	section after_problem
--------------------------------------------------------------*/ 
#after_problem h2:after {
	content: none;		
}
	
#after_problem h2 {
	margin-bottom: 0; 
}
	
.after_problem_text {
	font-size: 24px;
	line-height: 1.6;
}
	
@media only screen and (max-width: 767px) {	
.after_problem_text {
	font-size: 18px;
}
}
	
/*--------------------------------------------------------------
	section kasoku
--------------------------------------------------------------*/ 
#kasoku {
    background-color: #2aab9f;
}

#kasoku h3 {
    color: #fff;
    font-size: 29px;
	font-weight: normal;
	line-height: 1.6;
}
	
@media only screen and (max-width: 767px) {	
#kasoku h3 {
	font-size: 22px;
}
}
	
/*--------------------------------------------------------------
	section feature
--------------------------------------------------------------*/ 
#feature h3 {
	margin: 20px 0;
    font-size: 1.4em;
    font-weight: bold;
	text-align: center;
}
		
.feature_image {
	text-align: center;
}
	
.feature_text {
	padding: 0 20px;
    font-size: 14px;
	line-height: 1.8;
	text-align: left;
}
	
/*--------------------------------------------------------------
	section flow
--------------------------------------------------------------*/
/*--------------------------------------------------------------
	section compare
--------------------------------------------------------------*/  
.compare_table {
    border-collapse: collapse;
    width: 100%;
    font-size: 1em;
    margin-bottom: 50px;
    margin: 40px auto;
}

.compare_table th {
    width: 150px;
    background: #f9fafc;
    font-weight: normal;
}

.compare_table th,
.compare_table td {
	padding: 14px 8px 8px 8px;
    border: 1px solid #dbe1e8;
    text-align: center;
	vertical-align: middle;
}

ul.note_list  {
	margin-left: 1em;
}
	
ul.note_list li {
	list-style: disc;
	line-height: 1.8;
}
 
ul.note_list a:hover  {
	opacity: .6;
}
	
@media screen and (min-width: 768px){

td.hyologo {
    width: 300px;
}

td.hyologo img {
    width: 400px;
}    
} 
	
@media only screen and (max-width: 575px){
td.hyologo {
    padding: 0 !important;
    width: 50%;
}
}
	
/*--------------------------------------------------------------
	section jisseki
--------------------------------------------------------------*/ 
.jisseki_description {
	position: relative;
    background-color: #ffffff;
    padding: 50px 20px;
    border-radius: 8px;
    box-shadow: 0 0 30px rgb(0 0 0 / 10%); 
    height: 100%;
}
	
.jisseki_text {
	line-height: 1.6;
	text-align: center;
}
	
#jisseki01{
	background-image: url(/web/jp/trade/images/jisseki01.jpg);
 	background-repeat: no-repeat;
	background-position: center center;
    /*padding-top: 55px; */
}
  
#jisseki02{
	background-image: url(/web/jp/trade/images/jisseki02.jpg);
    background-repeat: no-repeat;
	background-position: center center;
    /*padding-top: 90px; */
}
  
#jisseki03{
    background-image: url(/web/jp/trade/images/jisseki03.jpg);
    background-repeat: no-repeat;
	background-position: center center;
    /*padding-top: 80px; */
}
  
.bigt {
    font-size: 80px;
    font-weight: bold;
    line-height: 100px;
}

.smallt {
    font-size: 20px;
    font-weight: bold;
}
	
@media only screen and (max-width: 1199px){	
.bigt {
    font-size: 68px;
} 
}

.jisseki_note {
    display: block;
    font-size: 0.85em
}

/*--------------------------------------------------------------
       cv_btn 追加
--------------------------------------------------------------*/ 			
.cv_btn_header2 {
       background-color: #365281 !important;
       margin-right: 1em !important;
}
    
@media (max-width: 1023px) {
.cv_btn_header2 {
        display: none !important;
}
}

.btn-cv.btn-blue {
    border-color: #365281;
    background: #365281;
}

.btn-cv.btn-blue:hover {
    background: #fff;
    color:#365281; 
}



/*last*/
#sec-inquiry{
	background: url("/web/jp/trade/images/sec_inquiry_sp_bg.png") 100% 0 no-repeat transparent;
	padding: 60px 0;
	text-align: center;
	background-size: cover;
}
#sec-inquiry h2{
	color: #fff;
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 20px;
}
#sec-inquiry .btns-wrap{
	background-color: #fff;
	padding: 20px;
}
#sec-inquiry .btns-wrap > div{
	margin-bottom: 30px;
}
#sec-inquiry .btns-wrap > div:last-child{
	margin-bottom: 0;
}
#sec-inquiry .btns-wrap > div h3{
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 12px;
}
#sec-inquiry .btns-wrap > div h3 .org{
	color: #FEA407
}
#sec-inquiry .btns-wrap > div h3 .large{
	font-size: 24px;
}
#sec-inquiry .btns-wrap > div a{
	color: #fff;
	display: inline-block;
	font-size: 20px;
	font-weight: bold;
	width: 100%;
	height: 60px;
	border-radius: 30px;
	padding: 15px;
	position: relative;
	text-decoration: none;
}
#sec-inquiry .btns-wrap > div a:after{
	content: "";
    display: block;
    width: 13px;
    height: 13px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    transform: rotate(45deg);
	position: absolute;
	top: 23px;
	right: 21px;
}
#sec-inquiry .btns-wrap > div a.top-btn-gre{
	background-color: #1A7F29;
	border:3px solid #1A7F29;
}
#sec-inquiry .btns-wrap > div a.top-btn-org{
	background-color: #FEA407;
	border:3px solid #FEA407;
}
#sec-inquiry .btns-wrap > div a:hover{
	background-color: #fff;
}
#sec-inquiry .btns-wrap > div a.top-btn-gre:hover{
	color: #1A7F29;
}
#sec-inquiry .btns-wrap > div a.top-btn-gre:hover:after{
    border-top: solid 2px #1A7F29;
    border-right: solid 2px #1A7F29;
}
#sec-inquiry .btns-wrap > div a.top-btn-org:hover{
	color: #FEA407;
}
#sec-inquiry .btns-wrap > div a.top-btn-org:hover:after{
    border-top: solid 2px #FEA407;
    border-right: solid 2px #FEA407;
}
@media screen and (min-width:1024px){
	#sec-inquiry{
		background: url("/web/jp/trade/images/sec_inquiry_pc_bg.png") center 0 no-repeat transparent;
		background-size: cover;
		padding: 80px 0;
	}
	#sec-inquiry h2{
		font-size: 48px;
		margin-bottom: 34px;
		line-height: 64px;
	}
	#sec-inquiry .btns-wrap{
		background-color: #fff;
		display: flex;
		align-items: baseline;
		padding: 0;
	}
	#sec-inquiry .btns-wrap > div{
		margin-bottom: 0;
		width: 50%;
	}
	#sec-inquiry .btns-wrap > div:first-child{
		padding: 24px 20px 30px 40px;
	}
	#sec-inquiry .btns-wrap > div:last-child{
		padding: 24px 40px 30px 20px;
	}
	#sec-inquiry .btns-wrap > div h3{
		font-size: 20px;
		margin-bottom: 14px;
	}
	#sec-inquiry .btns-wrap > div h3 .large{
		font-size: 30px;
	}
	#sec-inquiry .btns-wrap > div a{
		font-size: 40px;
		width: 100%;
		height: 100px;
		border-radius: 50px;
		padding: 18px;
	}
	#sec-inquiry .btns-wrap > div a:after{
		top: 40px;
		right: 33px;
		width: 18px;
		height: 18px;
	}
	#sec-inquiry .btns-wrap > div a.top-btn-gre,.btn-area .btn-cta.btn-gre,.mainv .mainv-btns-wrap .btn-cta.btn-gre{
		position: relative;
	}
	#sec-inquiry .btns-wrap > div a.top-btn-gre:before,.btn-area .btn-cta.btn-gre:before,.mainv .mainv-btns-wrap .btn-cta.btn-gre:before{
		content: "";
		background-image: url(/web/jp/trade/images/doc_request_img.png);
		background-repeat: no-repeat;
		background-size: contain;
		display: inline-block;
		position: absolute;
	}
	#sec-inquiry .btns-wrap > div a.top-btn-gre:before,.btn-area .btn-cta.btn-gre:before{
		width: 129px;
		height: 76px;
		left: -19px;
		top: 12px;
	}
	.mainv .mainv-btns-wrap .btn-cta.btn-gre:before{
		width: 84px;
		height: 49px;
		left: -12px;
		top: 7px;
	}
}