/*=============================================================
 flow
=============================================================*/
#flow .mod_head02 { margin-bottom: 15px; }
@media all and (min-width: 600px) { #flow .mod_head02 { margin-bottom: 30px; } }
#flowContents { margin-bottom: 35px; }
@media all and (min-width: 600px) { #flowContents { margin-bottom: 60px; } }
#flow .mod_cvBox01 + .mod_inner { margin-top: 25px; }
@media all and (min-width: 600px) { #flow .mod_cvBox01 + .mod_inner { margin-top: 50px; } }
.flowBox { position: relative; margin-bottom: 20px; padding: 25px 20px 25px 50px; border: 4px solid #f0f0f0; border-radius: 6px; }
.flowBox .num { display: inline-block; position: absolute; top: -10px; left: -4px; z-index: 1; width: 40px; height: 40px; line-height: 40px; border-radius: 100%; background: #e20; color: #fff; font-weight: bold; font-size: 36px; font-size: 2.25rem; text-align: center; }
.flowBox .arrow { position: absolute; top: 30px; left: 14px; width: 3px; height: 160px; background: #e20; }
.flowBox .arrow:after { position: absolute; bottom: 0; left: -4px; width: 8px; height: 8px; border-top: 3px solid #e20; border-right: 3px solid #e20; content: ""; -webkit-transform: rotate(135deg); transform: rotate(135deg); }
.flowBox .inner .tit { margin-bottom: 14px; font-weight: bold; font-size: 25.6px; font-size: 1.6rem; }
.flowBox .inner .img { margin-bottom: 20px; }
.flowBox .inner .check { position: relative; margin-top: 0; }
.flowBox .inner .check .ballon { position: relative; top: 20px; z-index: 1; text-align: center; }
.flowBox .inner .check .ballon span { display: inline-block; position: relative; line-height: 1; padding: 10px 20px; border-radius: 20px; background: #e20; color: #fff; font-weight: bold; font-size: 20.8px; font-size: 1.3rem; }
.flowBox .inner .check .ballon span:before { position: absolute; bottom: -14.5px; left: 50%; border: 7.5px solid transparent; border-top: 7.5px solid #e20; content: ""; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
.flowBox .inner .check .list { position: relative; padding: 30px 12px; border: 2px solid #e20; border-radius: 10px; background-image: -webkit-linear-gradient(135deg, #fff6f4 25%, #fffbfb 25%, #fffbfb 50%, #fff6f4 50%, #fff6f4 75%, #fffbfb 75%, #fffbfb); background-image: linear-gradient(-45deg, #fff6f4 25%, #fffbfb 25%, #fffbfb 50%, #fff6f4 50%, #fff6f4 75%, #fffbfb 75%, #fffbfb); background-size: 16px 16px; }
.flowBox .inner .check .list:before { position: absolute; top: 25px; right: 12px; width: 75px; height: 75px; background: url(../img/about/flow/ico01.png) no-repeat center; background-size: contain; content: ""; }
.flowBox .inner .check .list li { position: relative; padding-left: 25px; font-weight: 600; font-size: 20.8px; font-size: 1.3rem; }
.flowBox .inner .check .list li:before { position: absolute; top: 3px; left: 0; width: 16px; height: 16px; background: url(../img/about/flow/ico_check.png) no-repeat center; background-size: contain; content: ""; }
.flowBox .inner .check .list li + li { margin-top: 15px; }
@media all and (min-width: 600px) { .flowBox { margin-bottom: 30px; padding: 30px 36px 40px 106px; }  .flowBox .num { top: -15px; left: 12px; width: 70px; height: 70px; line-height: 70px; font-size: 4rem; }  .flowBox .arrow { left: 43px; width: 6px; }  .flowBox .arrow:after { left: -7px; width: 14px; height: 14px; border-top-width: 6px; border-right-width: 6px; }  .flowBox:nth-of-type(2) .arrow { top: 50px; }  .flowBox .inner .tit { margin-bottom: 28px; font-size: 2.2rem; }  .flowBox .inner .img { margin-bottom: 23px; }  .flowBox .inner .img img { -webkit-backface-visibility: hidden; backface-visibility: hidden; }  .flowBox .inner .check { margin-top: 8px; }  .flowBox .inner .check .ballon { top: 25px; }  .flowBox .inner .check .ballon span { padding: 15px 24px; border-radius: 40px; font-size: 1.8rem; }  .flowBox .inner .check .list { padding: 60px 30px 25px 20px; }  .flowBox .inner .check .list:before { top: 18px; right: 23px; width: 87px; height: 87px; }  .flowBox .inner .check .list li { padding-left: 40px; font-size: 1.5rem; }  .flowBox .inner .check .list li:before { width: 23px; height: 23px; }  .flowBox .inner .check .list li + li { margin-top: 20px; } }
.induction { position: relative; margin-bottom: 20px; padding: 15px 0; border: 2px solid #e20; border-radius: 8px; color: #e20; font-weight: bold; font-size: 22.4px; font-size: 1.4rem; text-align: center; }
.induction:before { position: absolute; bottom: -12px; left: 50%; width: 43px; height: 12px; background: url(../img/about/flow/arrow01_sp.png) no-repeat center; background-size: contain; content: ""; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
@media all and (min-width: 600px) { .induction { margin: 37px 0 50px; padding: 17px; border-width: 3px; font-size: 2.2rem; }  .induction:before { bottom: -23px; width: 90px; height: 23px; background-image: url(../img/about/flow/arrow01_pc.png); } }
.mod_cvBox01 + .mod_inner { margin-top: 25px; }
/*# sourceMappingURL=maps/flow.css.map */